> If I try any types of floats on any of them, in DW the border edges for
> (#mainnoright) no longer extend down past those nested divs.
Add this to your stylesheet -
#mainnoright { overflow:hidden; --
<!--[if IE]>
#mainnoright { zoom:100%; --
<[endif]-->
It may still not display correctly in CS3, although it will in preview, and
it will in CS4.
--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
==================
"cdoyle" <webforumsuser@macromedia.com> wrote in message
news:g946gi$8ak$1@forums.macromedia.com...
> OK,
> this has been bugging me today, and haven't been able to figure out what I
> need to do.
>
> I've attached my HTML and CSS related to the problem.
>
> I have basically a 2 column page with header and footer. The left column
> is
> the menu, and the right column is where everything goes.
>
> In the right column (#mainnoright) , I wanted to nest some other divs.
> What I want is inside this div is a grey box (#greybox), that will go
> across
> the top.
> Then under greybox, 2 columns (#MainContentText and #quicklinks).
>
> No matter what I do, I can't seem to get #MainContent and #quicklinks to
> line
> up next to each other)
> If I try any types of floats on any of them, in DW the border edges for
> (#mainnoright) no longer extend down past those nested divs.
>
> What is the correct way to get the layout like I want it, and have it
> display
> right in DW?
>
> <div id="wrapper">
> <div id="topbanner">
> <h1><img src="images/headerbanner.gif" width="510" height="40" /></h1>
> </div>
> <div id="menu"><?php require_once('includes/mainnav.php'); ?>
> </div>
> <div id="faux">
> <div id="LeftMenu">
> <p>Let Menu Item</p>
> <p> </p>
> </div>
> <div id="mainnoright">
> <div id="greybox">
> <p><img src="images/welcomebanner.png" alt="" width="600"
> height="57" /></p>
> </div>
> <div id="MainContentText">
> <h3>Text Stuff Here</h3>
> <p> </p>
> </div> <div id="quicklinks">This should line up next to
> MainContentText,
> but instead drops below it.</div>
> </div>
> </div> <!--End Faux -->
> <div id="footer"></div>
> </div> <!--End Wrapper -->
>
> <!--
>
> body {
> background-color: #dac479;
> margin-top: 4px;
> margin-right: 0px;
> margin-bottom: 0px;
> margin-left: 0px;
> --
> #mainnav {
> width: 100%;
> background-color: #60cae4;
> padding-bottom: 5px;
> --
> #menu {
> width:100%;
> background-color: #016cba;
> border-bottom-width: 5px;
> border-bottom-style: solid;
> border-bottom-color: #60cae4;
> --
>
> #wrapper {
> width: 800px;
> margin-right: auto;
> margin-left: auto;
> background-color: #FFFFFF;
> position: relative;
> font-family: Arial, Helvetica, sans-serif;
> --
> #banner {
> margin:0;
> padding: 20px;
> --
> #topbanner {
> width: 100%;
> --
> #LeftMenu {
> width: 150px;
> float: left;
> --
> #footer {
> height: 1em;
> width: 100%;
> clear: both;
> background-color: #0066CC;
> --
>
> #faux {
> margin-bottom: 5px;
> overflow: auto; /* Paul O Brien Fix for IE www.pmob.co.uk */
> width: 100%;
> background-image: url(images/brownbg.gif);
> background-repeat: repeat-y;
> float: left;
> --
>
> #mainnoright {
> width: 620px;
> margin-left: 170px;
> padding-right: 2px;
> padding-left: 2px;
> --
> h3 {
> color: a96804;
> --
>
> #greybox {
> background-color: #666666;
> width: 619px;
> padding-top: 5px;
> --
> #quicklinks {
> width: 100px;
> margin-left: 250px;
> --
> #MainContentText {
> width: 200px;
> --
> -->
> </style>
>