change logo size

[hollyboy]

In vb4 how do I change the logo size from 150px tto 120px?
Can't find the css

[MarkFL]

The anchor element containing the image has a classname of "logo-image".

[hollyboy]

The anchor element containing the image has a classname of "logo-image".

where do i find it in my admin panel?

[MarkFL]

If you wish to use that classname in a CSS selector, you can either add the selector to your "additional.css" template, which will affect only affect the styles whose template you add the selector to, or you can use a plugin to add the selector to all pages regardless of style. Since the logo you want to change is likely only in one style, you should be okay to simply add the selector to your template:

.logo-image {
width: 120px;
}

[RichieBoy67]

where do i find it in my admin panel?
Just copy that text and paste it into the style manager under Search in Templates.

#Better to use Mark's instructions above though. We must have posted at the same exact time.

[rhody401]

or maybe just upload the logo with the desired size

[hollyboy]

I have added:

.logo-image {
height: 120px;
}

to additional.css

but on my forum: http://www.interfans.org/forum/ the header does not get resized

Please help more

[RichieBoy67]

That is not just your logo but your entire header image. http://www.interfans.org/forum/images/header.jpg

That is why that css is not working.

Are you trying to squeeze in adsense there? The 728 by 90 is way to big for the header. I would suggest putting it under the navbar. Is that the reason you want to resize the logo?

[KevinL]

You could change the css for the navbar to :

.navbar {
margin: 92px 0 0 !important;
}

Just change the margin from 27px to 92px

[hollyboy]

You could change the css for the navbar to :

.navbar {
margin: 92px 0 0 !important;
}

Just change the margin from 27px to 92px



it does work look
http://www.interfans.org/forum/index.php

[MarkFL]

If you want to change the size of the image (where the height is 120px and the width is 100%), use these selectors:

.above_body {
background-size: 100% 120px;
}

.navbar {
margin: 90px 0 0 !important;
}

[hollyboy]

If you want to change the size of the image (where the height is 120px and the width is 100%), use these selectors:

.above_body {
background-size: 100% 120px;
}

.navbar {
margin: 90px 0 0 !important;
}


Still does NOT work :(

I am trying to put this header
http://www.interfans.org/forum/images/header.jpg

previously it was 150px height now 120px

[MarkFL]

Still does NOT work :(

It worked when I altered the page source using Firebug. :confused:

[hollyboy]

It worked when I altered the page source using Firebug. :confused:


I am trying to put this header
http://www.interfans.org/forum/images/header.jpg

previously it was 150px height now 120px

[MarkFL]

You can resize the image using CSS (as I showed you). It is best though to size the image using an image editor, so that the aspect ratio is exactly what you want.

[hollyboy]

You can resize the image using CSS (as I showed you). It is best though to size the image using an image editor, so that the aspect ratio is exactly what you want.

I put exactly your code but does not work.
Can you log in my admin and see?

[RichieBoy67]

Mark is saying you need to resize the image first or the aspect ratio will be off.

[Seven Skins]

Try this:

Add these two lines at the bottom of additionl.css

.body_wrapper { margin-top: 20px; }
.navbar { margin-top: 120px !important; }



And remove this from your additional.css
.above_body { height: 152px; }