I used the layoutomatic css box generator I looked it up in Floatorial (<!-- m --><a class="postlink" href="http://css.maxdesign.com.au/floatutorial/index.htm">http://css.maxdesign.com.au/floatutorial/index.htm</a><!-- m -->)
yet still I don't understand why my menu jumps to the bottom
see herewww.georgelangenberg.com/wordpress
It looks like the main content area is too wide and pushing the menu float down below it. You could look at
a) checking that the width of the containers aren't too wide to fit both across
b) check for margins or padding that is passing on to reduce the available space
A good trick at this point is to start giving your divs borders or background colours so you can get a better idea of what is breaking the page.
Hope this is of some assistance.
Hi Porco I colored the content DIV and as far as I understand the content DIV leaves enough space for the menu to jump up, yet it won't do that... why? sighMy guess is you'd be looking for a margin property. Padding adds space inside the box but margin adds space outside the box. Try putting
padding: 0;
margin: 0;
just to see what you've got there. Of course comment out the padding and margin properties you already have, don't want to lose them
Could be a good start at tracking it down.
Basically I never had much of a look under the hood but I sensed there were 2 main divs working there right? the content one and the right hand floated nav?
Hope this is of some assistance...Actually there are a few DIVs in a container called #rap
#header
#content
#menu (that doesn't float right)
.footer called credit
where should i ad the
padding: 0;
margin: 0;
?
#rap {
width: 740px;
\width: 760px;
w\idth: 740px;
border: 1px solid gray;
margin: 10px;
margin-left: auto;
margin-right: auto;
padding: 10px;
}
#header {
font: italic normal 230% 'Times New Roman', Times, serif;
letter-spacing: 0.2em;
padding: 5px;
margin-bottom: 5px;
background-color: rgb(213, 219, 225);
}
#content {
padding: 5px;
margin-right: 250px;
background-color: red;
}
#menu {
float: right;
width: 200px;
\width: 210px;
w\idth: 200px;
margin: 0;
margin-left: 5px;
padding: 5px;
background-color: rgb(235, 235, 235);
}
.credit {
clear: both;
padding: 5px;
margin-top: 5px;
background-color: rgb(213, 219, 225);
}First test to do now is to background color the menu and you'll see that its too fat to fit in the space you want it to go I'd expect.
Next test is to put borders around everything, thats what I do so then the page makes sense...
border: 1px solid #ccc;
add it to all of your divs if you have to one at a time. Start from the top left div and try the no margin or padding thing. Its just a test to try and find out what is invisibly pushing across the width of your container.
#NOTE: Probably a good little test to expand the width of your main container, what everything is in, and see it pop up. That'll give you faith at least. Its just being pushed down there cos its too fat or someone's too fatokay Tasmania i'l try that, thanks so far from Amsterdam,it was the
float: right of the content
combined with the margin right
the menu didn't want to go across that
so now the content has a width and floats left.
thanks georgecool, run into it every day too
yet still I don't understand why my menu jumps to the bottom
see herewww.georgelangenberg.com/wordpress
It looks like the main content area is too wide and pushing the menu float down below it. You could look at a) checking that the width of the containers aren't too wide to fit both across
b) check for margins or padding that is passing on to reduce the available space
A good trick at this point is to start giving your divs borders or background colours so you can get a better idea of what is breaking the page.
Hope this is of some assistance.
Hi Porco I colored the content DIV and as far as I understand the content DIV leaves enough space for the menu to jump up, yet it won't do that... why? sighMy guess is you'd be looking for a margin property. Padding adds space inside the box but margin adds space outside the box. Try putting padding: 0;
margin: 0;
just to see what you've got there. Of course comment out the padding and margin properties you already have, don't want to lose them
Could be a good start at tracking it down.
Basically I never had much of a look under the hood but I sensed there were 2 main divs working there right? the content one and the right hand floated nav?
Hope this is of some assistance...
Actually there are a few DIVs in a container called #rap#header
#content
#menu (that doesn't float right)
.footer called credit
where should i ad the
padding: 0;
margin: 0;
?
#rap {
width: 740px;
\width: 760px;
w\idth: 740px;
border: 1px solid gray;
margin: 10px;
margin-left: auto;
margin-right: auto;
padding: 10px;
}
#header {
font: italic normal 230% 'Times New Roman', Times, serif;
letter-spacing: 0.2em;
padding: 5px;
margin-bottom: 5px;
background-color: rgb(213, 219, 225);
}
#content {
padding: 5px;
margin-right: 250px;
background-color: red;
}
#menu {
float: right;
width: 200px;
\width: 210px;
w\idth: 200px;
margin: 0;
margin-left: 5px;
padding: 5px;
background-color: rgb(235, 235, 235);
}
.credit {
clear: both;
padding: 5px;
margin-top: 5px;
background-color: rgb(213, 219, 225);
}First test to do now is to background color the menu and you'll see that its too fat to fit in the space you want it to go I'd expect.
Next test is to put borders around everything, thats what I do so then the page makes sense...
border: 1px solid #ccc;
add it to all of your divs if you have to one at a time. Start from the top left div and try the no margin or padding thing. Its just a test to try and find out what is invisibly pushing across the width of your container.
#NOTE: Probably a good little test to expand the width of your main container, what everything is in, and see it pop up. That'll give you faith at least. Its just being pushed down there cos its too fat or someone's too fat
okay Tasmania i'l try that, thanks so far from Amsterdam,it was the float: right of the content
combined with the margin right
the menu didn't want to go across that
so now the content has a width and floats left.
thanks georgecool, run into it every day too