Forum Moderators: not2easy
The first 3 div's (images) are lining up fine and the 2nd row of 2 divs (welcome and member login), it's the 3rd row of divs (news/test/domain reg) that doesnt line up in IE... it works fine in FF and safari.
Been tryin to find an css IE hack but not sure which one I would need.
Thanks!
Danny
[edited by: tedster at 2:57 pm (utc) on June 18, 2008]
Welcome to WebmasterWorld!
Please read the forum charter [webmasterworld.com] Which will explain about posting links. If you can still edit your post, you need to remove your links and post your code within your post.
Just follow the guide lines within the forum charter.
You might wish to validate your page [validator.w3.org]. It is possible that some of the errors that are showing up could be causing your problem. Make sure you validate your css [jigsaw.w3.org]as well.
If you have any questions regarding the errors, post them in this thread and someone will help you out with them.
4~css
CSS CODE:
#news-container {
clear: both;
float: left;
width: 250px;
height: 250px;
margin: 10px 0 0 40px;
}
#news {
float: left;
width: 240px;
height: 32px;
margin: 10px 0 0 10px;
background-image: url(images/news.gif);
}
#news-body {
clear: both;
float: left;
padding: 5px 0 0 10px;
width: 240px;
height: 100%;
}
#testimonial-container {
float: left;
width: 250px;
height: 250px;
margin: 10px 0 0 10px;
}
#testimonial {
float: left;
width: 240px;
height: 32px;
margin: 10px 0 0 10px;
background-image: url(images/whatpeoplesay.gif);
}
#testimonial-body {
clear: both;
float: left;
padding: 5px 0 0 10px;
width: 240px;
height: 100%;
}
#domain-container {
float: left;
margin: 10px 25px 0 10px;
width: 300px;
height: 144px;
background-image: url(images/domain_registration.gif);
}
#domain {
float: left;
padding: 80px 15px 0 15px;
width: 270px;
height: 100%;
}
HTML code:
<div id="news-container">
<div id="news"></div>
<div id="news-body">
<div class="roundcont">
<div class="roundtop"><img src="images/tl.gif" alt="" width="21" height="21" class="corner" style="display: none"></div>
<p class="style7">June 10th, 2008</p>
<p class="style9">TEXTTEXT</p>
<p class="style7"><br>
TEXTTEXT</p>
<p class="style9">TEXTTEXT</p>
<div class="roundbottom"><img src="images/bl.gif" alt="" width="21" height="21" class="corner" style="display: none"></div>
</div>
</div>
</div>
<div id="testimonial-container">
<div id="testimonial"></div>
<div id="testimonial-body">
<div class="troundcont">
<div class="troundtop"><img src="images/tl.gif" alt="" width="21" height="21" class="corner" style="display: none"></div>
<p class="style9">
TEXTTEXT</p><p> TEXTTEXT</p>
<div class="troundbottom"><img src="images/bl.gif" alt="" width="21" height="21" class="corner" style="display: none"></div>
</div>
</div>
</div>
<div id="domain-container">
<div id="domain">
<form action="http://example.com/support/domainchecker.php" method="post">
<p> </p>
<p> </p>
<p><input type="text" name="domain" class="c3"> <select name="ext">
<option>.com</option>
<option>.net</option>
<option>.org</option>
<option>.biz</option>
<option>.info</option>
</select></p>
<p><input type="image" src="images/go.png" alt=""></p>
</form>
</div>
</div>
</div>
I hope this helps,
Your last div in the second row, add a clear on that one, then add a clear to the third row.
There is also the Alsett Clearing method. Position is everything has an article on it. I find that it works really well.
This is the only thing that I can think of right now is that it is a clearing issue.
Let us know how it works, and google the clearing method I mentioned above. You might want to give that a go.
