Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)
-   -   [SOLVED] Moved Menu Bar to Header Image - Space persists between header and body (http://forum.bytesforall.com/showthread.php?t=14459)

LA's FINE Jun 2, 2011 11:56 AM

[SOLVED] Moved Menu Bar to Header Image - Space persists between header and body
 
I inserted the following code at Inserts:

div#menu1 ul.rMenu {
position: relative;
top: -40px;
}

I succeeded in moving the menu bar onto the Header Image - but now there's a space between the header and the body... what am I missing?

juggledad Jun 2, 2011 12:04 PM

I suggest you go read about CSS Positioning

LA's FINE Jun 2, 2011 12:16 PM

Thanks. Will do! Bookmarked.

LA's FINE Jun 2, 2011 01:16 PM

OK... I'm clearly a CSS newbie... but I'm guessing that the problem has to do with position. If I set it to "relative", I can get the buttons in the right place, but there's still space between the header image and the body. The space goes away if I change the position to "fixed" or "absolute", but then the buttons don't stay in the right place when I resize.

aQuickStudy Jun 2, 2011 04:17 PM

You shouldn't need positioning for this. Without a link to the site it's impossible to troubleshoot, but I imagine you have extraneous padding or margins. I'd use Firebug to check it out.

juggledad Jun 2, 2011 04:34 PM

if you are going to be playing with positioning, I suggest using a fixed width layout.

LA's FINE Jun 2, 2011 04:40 PM

It is fixed width. I guess where I'm having the learning problem is that I don't completely understand in this situation what relative positioning is relative to.

I have an image that I'm using as the header, and want the menu buttons to appear on the image. I was able to accomplish this by making the background transparent and moving the position of the menu up - but when I do this, a space persists between the image and rest of the content.

If I change from "relative", the space disappears, but the text position changes depending on the size of my browser window.

juggledad Jun 2, 2011 05:23 PM

instead of using top, try playing with margin-top

aQuickStudy Jun 2, 2011 06:06 PM

We've discussed via PM but for the benefit of future readers here are the things we've talked about trying:

- trying bottom padding on the menu
- slicing the header image horizontally so that you are using one slice as the menu background and another as the header, with no space between

(those are separate suggestions, by the way)

LA's FINE Jun 2, 2011 06:50 PM

margin-top! Did it! Thanks!!!

(I have so much to learn)

LA's FINE Jun 2, 2011 06:51 PM

and thanks also very much to aQuickStudy! Clever solutions indeed!


All times are GMT -6. The time now is 03:24 AM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.