background preloader

Rounded Corner Boxes

Facebook Twitter

Rounded Corners in Internet Explorer: Staying Ahead of the Curve. Rounded Corners in Internet Explorer As of December 2011, this topic has been archived. As a result, it is no longer actively maintained. For more information, see Archived Content. For information, recommendations, and guidance regarding the current version of Internet Explorer, see Internet Explorer Developer Center.

Note Windows Internet Explorer 9 supports adding rounded corners to elements using the border-radius properties. September 9, 2009 Summary: This article discusses adding rounded corners to a Web page layout and provides links to several techniques to accomplish this in Internet Explorer 8 and earlier. Contents Introduction Rounding the corners of layout boxes remains one of the most popular techniques in Web design today.

Internet Explorer and the border-radius Properties While the W3C has specified the border-radius properties in its latest CSS3 working draft, Microsoft has not implemented the border-radius properties in Internet Explorer 8. Other Rounded Corners Solutions. Sliding Doors of CSS. A rarely discussed advantage of CSS is the ability to layer background images, allowing them to slide over each other to create certain effects. CSS2’s current state requires a separate HTML element for each background image. In many cases, typical markup for common interface components has already provided several elements for our use.

Article Continues Below One of those cases is tabbed navigation. It’s time to take back control over the tabs which are continually growing in popularity as a primary means of site navigation. Now that CSS is widely supported, we can crank up the quality and appearance of the tabs on our sites. What if we could take the exact same markup from the tabs above, and turn them into something like this: With simple styling, we can. Where’s the Innovation? Many of the CSS-based tabs I’ve seen suffer from the same generic features: blocky rectangles of color, maybe an outline, a border disappears for the current tab, a color changes for the hover state. Spiffy Box - Simple Rounded Corner CSS Boxes made easy.