Page 1 of 1

Resizing Logo in responsive themes

Posted: Fri Jun 07, 2013 6:18 am
by darkwhite
Hello everybody!
I have opencatrt 1.5.5.1 installed and I'm using this theme: Free Pav bike store responsive theme.

My logo is too small and whatever size I upload it, it get resized to something like 140px wide!
In my admin panel there is no image option to set the logo size!
the code for my logo in stylesheet.css is:

Code: Select all

#header #logo {
	padding:24px 0;
}
and when i select my logo in firebug it shows below code in bootstrap.css

Code: Select all

img {
  /* Responsive images (ensure images don't scale beyond their parents) */

  max-width: 100%;
when i change it to for example 200% the logo gets bigger but in smaller screens it overlaps the elements on the right! I tried to set the logo size in stylesheet but again it overlaps in smaller screens!

any input would be much appreciated.

Re: Resizing Logo in responsive themes

Posted: Fri Jul 19, 2013 3:49 am
by aliena
Hello do you have a solution , i have same problem.

Re: Resizing Logo in responsive themes

Posted: Fri Jul 19, 2013 4:55 am
by dmsims
Try this:

style="height: auto; display: block; max-width: 100% !important;"

Re: Resizing Logo in responsive themes

Posted: Thu Jul 25, 2013 9:16 pm
by aliena
This parameter didnt work :( Only work with max-width: 0 , but in Internet Explorer dont show logo.

Re: Resizing Logo in responsive themes

Posted: Fri Jul 26, 2013 12:48 pm
by butte
Forcing an image to change width is easy. Forcing to to stay proportionate is not easy. Browser responses vary. The new html5 standards are not due to be "recommended" until 2022. Meanwhile, the folks writing that and website designers and the browser rendering writers play with the (in)capabilities and contribute to the outcome.

Re: Resizing Logo in responsive themes

Posted: Sat Jul 27, 2013 5:19 pm
by MikeOTW
Having exactly the same problem.
I am a web developer and I understand the limits of HTML5 browsers and problems with responsive themes etc, but I can't get this blooming thing fixed.
My temporary workaround is overiding img maxwidth of 100% and (In my case, because single currency and single language gives me space) setting a width of 590px works (line 302 in catalog\view\theme\pav_bikestore\stylesheet\stylesheet.css... #logo img {max-width: 590px;}) - but it aint responsive, I know.
Just don't know how much time I now want to spend getting the logo to stay at the top when resizing browser, ie: keeping it responsive.
Anyone else got a neat solution before I lose my Saturday to this otherwise very good theme?