Outside Image Logo Size

[Nick Statt]

Hi, I’m trying to upload a rectangular image logo that goes about a third of the page (roughly to the end of my five tab menu bar), but I can’t really figure out if there are set dimensions. How big should I make the file to get it that far across?

Also when it is placed, what is the best way to move it down so that just touches the menu bar? I’m having trouble figuring out the best way to do that in the style.css and the image is hovering a little too much and leaving a big gap between it and the menu bar.

Thanks so much for your help.

[Bill Robbins]

Nick,

I’d be glad to help you position your logo. If you’d like to send over a link to where you’re working with it, I can give you more precise instructions for your specific situation.

Thanks,
Bill

[Nick Statt]

That would be great. I’m working on it here – http://nickstatt.com/bonackers/. Right now, I uploaded a draft of the image at 800 x 367 and it’s obviously way too large. I wanted it to extend to the edge of the ‘Extras’ menu bar tab, and be of a decent enough height that you could see most if not all of the static boxes like the demo Epic theme has. And like I mentioned, I’d want to bump it down so that it just hovered about the menu bar without displacing anything else, which seems to be what happens when I try and use padding or margin changes.

Thanks again for the help. I’m relatively new at CSS and this is for a college project, so it’s been pretty touch and go thus far.

[Bill Robbins]

NIck,

Thank you for sending over the link. I took a look and it appears to me that the edge of the “extras” menu item is 442 pixels from the left hand side. If you made your logo around that wide it would be about 225 pixels tall.

You may want to adjust the margins around the logo a bit too. You can paste this either in the box for Custom CSS on the theme options page or at the bottom of the style.css file if you’d rather do that:

.outside-logo {
	margin-top: 15px;
	margin-bottom: 10px;
}

That will move the logo up just a bit and keep the bottom margin proportional.

Doing both of those, I ened up with your site looking like this:

http://d.pr/i/MkD0

If you have any questions or trouble, let me know.

Thanks,
Bill

[Author]

Posts