Welcome to WebmasterWorld Guest from 54.156.92.140

Forum Moderators: not2easy

Message Too Old, No Replies

anchor border and container div width- IE issue

     
11:08 am on Feb 20, 2012 (gmt 0)

New User

5+ Year Member

joined:Feb 20, 2012
posts:1
votes: 0

below is the extracted code to show an issue in IE only.
I am expecting border for <a> but top border is not visible in IE if container div got width sepcified.
Kept css inline for easy replication.

[code]<div style="width:100px;">
<ul style='border-bottom:1px solid #778;'>
<li style="list-style:none;margin:0;display:inline;">
<a href="#" style='border:1px solid green;text-decoration:none'>Item one</a>
</li>
</ul>
</div>[/code]
5:27 pm on Feb 20, 2012 (gmt 0)

Senior Member

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Nov 28, 2004
posts:7999
votes: 0


Welcome aboard poonkave, but you may have to change the display of the anchor to block or inline-block. Right now it's default, inline, so it really has no "height" so won't have a border-top.

This presents another problem. A block element inside an inline element (the LI's) is bound to create more issues, moving forward you may have to change the layout of the LI's.