menu bar will not sit inside div

[old_picker]

In large screen the nav bar sits at the top of the page obscuring the header div even though its div is below in code and design view [d/weaver CS6].

In design view the menu bar does not want to sit in its div. It floats above it and the div looks like a thin blue line behind the menu bar. Looks kind of like the div bar refuses to have the menu bar inside it so the menu bar jumps around wherever. As the browser is resized you can see a point where the menu bar wont fit horizontally and it suddenly goes into drop down mode and that is fine and working as I want it to, In mobile view it behaves. The menu is collapsed and drops down to show the links as required. You can however see when the screen size is small as you can go the menu slips up under the header div just a smidge.

 

be really nice if I could lock this thing down and get it to stay inside its div tag

 

it is probly a very simple fix but I cant see it

 

it is only a small amount of code to look at so here's a link to the page

http://www.aargent.com.au/fluid_grid/

 

any comments or tips gratefully received

thanks

ray

[COBOLdinosaur]

The validation error on the input may have something to do with it. However the rel problem is trying to use Dreamweaver design view and expecting it to render like a browser. If you want to see what something is going to look like in a browser, then the only reliable way to do it is by looking at it in a browser; actually a selection of browsers to cover those you are going to support is the only way to test rendering and know how it is going to present.

 

Your first step in any testing should be to put the markup through the validator (takes less than 10 seconds) because it is not logical to expect correct rendering with defective code.