OK, I'm working on my site, and I am creating a new way to display the comments. I'm having a problem with IE adding an extra 5px worth of margin onto the top and bottom of my <hr />'s. Any idea where this is coming from?
<!-- m --><a class="postlink" href="http://rhea.dr2.net/~dandaman/comment.php">http://rhea.dr2.net/~dandaman/comment.php</a><!-- m -->
Thanks,
-Dan
PS: Omega, if you're reading this, don't you DARE reply with something about not liking <hr />'s because that doesn't solve my problem!!! Why bother with an unnecessary tag?div.thecomment {
margin-bottom: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #f90;
}OK, perhaps I'll do that. But any ideas why IE is doing this? Better to solve a problem then ignore it.It seems IE puts some sort of margin around HR which cant be modified from CSS or inline HTML. Try negative margins and you can move the HR to the top or bottom of this margin. margin-top: -10px moves it to the top and margin-bottom: -10px moves it to the bottom. If you try margin: -10px or both it just goes to the top. Dont know if this helps at all, but its a start /shrug.Why bother with a hr tag when you can just add a border? You know how border's work, even IE can get those right, there's less uncertainty.
It occurs to me that perhaps you should also be using a list to mark-up your blog.
It wouldn't take much to convert it, just add a <ul> at the start and a </ul> at the end, then find and replace your <div>'s with <li>'s.
More semantic mark-up helps improve the accessibility of your page. It should also be easier to modify your code as well because instead of seeing <div> everywhere you will have <li> and </li> to signify each new blog. (Granted you probably use a loop in PHP to do this but when you are coding it in the first place or modifying it in future it will be easier.)
I would also like to suggest that you use <p> tags for your blog and then another for your "Posted by me..", then you can apply the border to the bottom p tag while having multiple paragraphs in each blog.OK, I'm using a border and I've converted it to a list. Thank you lavalamp.No, thank-you.
<!-- m --><a class="postlink" href="http://rhea.dr2.net/~dandaman/comment.php">http://rhea.dr2.net/~dandaman/comment.php</a><!-- m -->
Thanks,
-Dan
PS: Omega, if you're reading this, don't you DARE reply with something about not liking <hr />'s because that doesn't solve my problem!!! Why bother with an unnecessary tag?div.thecomment {
margin-bottom: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #f90;
}OK, perhaps I'll do that. But any ideas why IE is doing this? Better to solve a problem then ignore it.It seems IE puts some sort of margin around HR which cant be modified from CSS or inline HTML. Try negative margins and you can move the HR to the top or bottom of this margin. margin-top: -10px moves it to the top and margin-bottom: -10px moves it to the bottom. If you try margin: -10px or both it just goes to the top. Dont know if this helps at all, but its a start /shrug.Why bother with a hr tag when you can just add a border? You know how border's work, even IE can get those right, there's less uncertainty.
It occurs to me that perhaps you should also be using a list to mark-up your blog.
It wouldn't take much to convert it, just add a <ul> at the start and a </ul> at the end, then find and replace your <div>'s with <li>'s.
More semantic mark-up helps improve the accessibility of your page. It should also be easier to modify your code as well because instead of seeing <div> everywhere you will have <li> and </li> to signify each new blog. (Granted you probably use a loop in PHP to do this but when you are coding it in the first place or modifying it in future it will be easier.)
I would also like to suggest that you use <p> tags for your blog and then another for your "Posted by me..", then you can apply the border to the bottom p tag while having multiple paragraphs in each blog.OK, I'm using a border and I've converted it to a list. Thank you lavalamp.No, thank-you.