Dealing with IE for Round-Cornered Boxes

AGS · September 3rd, 2005, 03:07 PM

I have a question concerning âDealing with Internet Explorerâ part of section âCreating Fixed-Width, Round-Cornered Boxesâ. There is an example of .box h2 {â¦} selector which applies image with rounded corners to the top of our box. But when I tried to use the same technique for the bottom <p/> element (there is no such example in the book) my attempt failed. The border of the box just shifted up the number of pixels designated in margin-bottom (for example -24px as I am using 20px for padding and 4px for border) and the image is overlapped with background color. The CSS I am using is

Code:

#box p.last {
    background: url("i/bottom.gif") left bottom no-repeat;
    margin: 0px -24px -24px -24px;
    padding: 0px 20px 20px 20px;  
}

The same code is working for Firefox just fine but my goal is Internet Explorer.
Best regards,
Alexei

ftor · August 31st, 2007, 06:30 AM

Hey guys how to round bottom corner in IE?