HTML Forum

**Frederic** · 04-06-2005, 11:45 AM

Hi there!
I've got a little problem with the use of DIV's
I've created a test page so everybody can see what's the problem:
http://www.fadetolife.be/Test/a.php
In Internet Explorer, the setting is perfect; when the content on the right grows, the other parts will became smaller.
In FireFox on the other hand, the DIV's are being placed above each other.
Can anyone help me with this issue?

Greetings

**Darrend** · 04-06-2005, 08:44 PM

Hi Frederic
The code below could be one solution for you. It seems cross-browser compatible until you get to below 800px window width and it breaks slightly in IE. Have a look and see what you think. I've removed the <br> tags and replaced them with a margin-bottom declaration to separate the content.

HTML Code:

<style type="text/css">
.float1 {
width:8%;
border: 1px dashed #0000FF;
color: #000000;
text-align: center;
margin: 0px;
padding: 4px;
float:right;
}

.float2 {
width:87%;
border: 1px dashed #FF0000;
color: #000000;
text-align: center;
margin: 0px;
padding: 4px;
margin-bottom:10px;
}

</style>
</head>
<body>
<div class="float1">Kort</div>
<div class="float2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  Curabitur nonummy libero eu eros. Nunc orci turpis, mollis vitae, lobortis
  congue, suscipit nec, enim. Vivamus luctus ornare velit. Vestibulum sed nunc.
  Aenean sit amet diam. Vestibulum auctor. Sed sed orci. Morbi bibendum porta
  velit. Nulla ultrices. Aenean enim ipsum, varius commodo, consectetuer vitae,
  iaculis pharetra, sem. Integer aliquam sem vitae felis. Maecenas commodo bibendum
  nunc. Nulla facilisi. Etiam scelerisque urna. Fusce odio tellus, lobortis ac,
  ultrices id, imperdiet a, lacus. Nullam cursus, elit a molestie fermentum,
  augue wisi pellentesque mauris, ac faucibus velit nibh eu elit. Donec rutrum
  felis quis nisl. Phasellus lectus ligula, commodo id, tristique eu, tincidunt
id, urna. In hac habitasse platea dictumst. Nulla vestibulum sollicitudin enim.</div>

<div class="float1">Zeerzeerlang</div>

Darren

CIW Professional
Studying - Last stage of CIW Master Designer
www.ddwebcreations.co.uk

**Frederic** · 04-07-2005, 05:59 AM

Thanks for the answer!
But it seems you've created a margin, so the div on the left won't go as far as the border of the right-div.
If you take a look at your code, you see there will be a whitespace. With my code (above) on the other hand, everything fits just fine (in Internet Explorer)

Greetz

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!