Arena - blog

I've described the problem with NOSHeadlines.nl in a forum thread: the site's using a script targeted at non-Gecko/non-IE browsers to add dummy divs that can accomplish the same as one simple line of Mozilla-only CSS:

-moz-border-radius: 0px 8px 0px 0px;

Opera runs the script and creates the additional divs, but doesn't get an additional stylesheet to display them as intended, as does IE:

<!--[if lt IE 7]><link rel="stylesheet" href="http://www.nosheadlines.nl/templates/nosheadlines/css/ie6fix.css" type="text/css" /><![endif]-->

One way to fix the display problems in Opera is to stop it from running the JS function causing all this, namely fixBrowserIssues() (how ironic). But I want the rounded corners in Opera too! Not because it looks better, but because I can't imagine that Opera isn't capable of doing this...

The closest I got to a satisfying result is this, though:



...using the following UserCSS:

div.dummy-1 {
position: absolute !important;
top: -1px !important;
left: -1px !important;
height: 9px !important;
width: 10px !important;
background: url(http://www.nosheadlines.nl/templates/nosheadlines/img/layout/corners/upper-left.gif) no-repeat top left !important;
border: none !important;
padding: 0 !important;
}

div.dummy-2 {
position: absolute !important;
top: -1px !important;
right: -2px !important;
height: 9px !important;
width: 10px !important;
background: url(http://www.nosheadlines.nl/templates/nosheadlines/img/layout/corners/upper-right.gif) no-repeat top left !important;
border: none !important;
padding: 0 !important;
z-index: 2;
}


h3 div.dummy-2 {
top: 2px !important;
}

I'm hoping someone can help me with the last part.