|
#1
Jun 2, 2011, 11:56 AM
|
|
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?
|
#2
Jun 2, 2011, 12:04 PM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
I suggest you go read about CSS Positioning
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#3
Jun 2, 2011, 12:16 PM
|
|
Thanks. Will do! Bookmarked.
|
#4
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.
|
#5
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.
|
#6
Jun 2, 2011, 04:34 PM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
if you are going to be playing with positioning, I suggest using a fixed width layout.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#7
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.
|
#8
Jun 2, 2011, 05:23 PM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
instead of using top, try playing with margin-top
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#9
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)
|
#10
Jun 2, 2011, 06:50 PM
|
|
margin-top! Did it! Thanks!!!
(I have so much to learn)
|
#11
Jun 2, 2011, 06:51 PM
|
|
and thanks also very much to aQuickStudy! Clever solutions indeed!
|
|