Obramowanie w CSS

w dziale Strony WWW w Operze
daroc napisał(a):

Czy możecie rzucić okiem dlaczego w drugim elemencie DIV nie wyświetla się po lewej stronie czerwony pasek (obramowanie)? Chodzi mi o wersję 9.50 (nawet najnowszy build), w 9.2x działa wszystko dobrze. Co ciekawe, w IE7 drugi element ma obramowanie typu dashed zamiast dotted, ale pasek czerwony jest.
Po usunięciu background:#ECECEC (div.recordv, div.recordh) obramowanie się pojawia.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<title>Test</title>
<style type="text/css">
body {margin:0}
div.recordv, div.recordh {background:#ECECEC; margin:10px 0 20px 0; border-style:dotted solid; border-color:#666 #A00}
div.recordv {border-width:1px 0; padding:0 0 0 30px}
div.recordh {border-width:1px 0 1px 5px; padding:0 0 0 25px}
</style>
</head>
<body>
<div class="recordv">abc</div>
<div class="recordh">abc</div>
</body>
</html>

Zaufany napisał(a):

Powiedziałbym, że zły dział.

Wygląda na błąd w najnowszym buildzie wersji niestabilnej.

Co ciekawe, działają inne style obramowania.

1. Będzie trzeba przeczytać bardzo dokładnie specyfikację.
2. Będzie trzeba przetestować inne przeglądarki. (Produkt Microsoftu się nie liczy.)
3. Będzie trzeba sprawdzić kilka ostanich buildów.
4. Będzie trzeba umieścić kod do testowania na jakimś serwerze, w kilku wariantach.

Jeśli po tej procedurze nadal będzie wyglądało to na ewidentny błąd, będzie trzeba go zgłosić.

Zajec napisał(a):

Wygląda na to, że Opera gubi się gdy różne obramowania (górne+dolne i prawe+lewe) mają różne style:

border-style: dotted solid;
No i oczywiście w specyficznych warunkach (nadany background oraz boczne obramowanie solid). Proponuję oczyścić trochę ten przykład (marginesy, paddingi, dwie wartości border-color) i zgłaszać od razu jako buga, uważam że nie ma tu jaiegokolwiek błędu (w kodzie strony).

Jeśli chodzi o dotted, to jest on zbyt skomplikowany dla IE wink Od zawsze to przeglądarkowe coś traktuje go jako dashed.

Zaufany napisał(a):

Gubi się, ale na przykład "border-style: dotted dashed" działa.

daroc napisał(a):

W IE7 niby jest już styl dotted. Ale jak widać nie do końca on działa...
Gdzie wrzucić ten wątek? Do beta-testing w wątku o najnowszej weekly?
Najprostsza forma jaką udało mi się uzyskać, w kilku wariantach.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<title>Test</title>
<style type="text/css">
div.testa, div.testb, div.testc, div.testd {border-color:#F00; border-width:3px}
div.testa {background:#DDD; border-style:dotted solid}
div.testb {background:#DDD; border-style:dotted solid solid solid}
div.testc {background:#DDD; border-style:dotted}
div.testd {border-style:dotted solid}
div.spacer {height:30px}
</style>
</head>
<body>
<div class="testa">testa (test failed - left and right border is not displayed)</div>
<div class="spacer">&nbsp;</div>
<div class="testb">testb (test failed - left and right border is not displayed)</div>
<div class="spacer">&nbsp;</div>
<div class="testc">testc (displayed properly - because all borders are dotted)</div>
<div class="spacer">&nbsp;</div>
<div class="testd">testd (displayed properly - because of no background)</div>
</body>
</html>

Zaufany napisał(a):

Ja bym wrzucił do oddzielnego w beta-testing. Inaczej zginie w gąszczu niezwiązanych postów.

Dodaj jeszcze przykłady z double w miejscu solid, które się wyświetlają poprawnie (chyba).

Zajec napisał(a):

Zgłoś po prostu buga przez bugtracking Opery.

Zaufany napisał(a):

Sugerowałbym zgłosić z jeszcze jedną ramką, gdzie w miejscu solid jest coś innego.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<title>Test</title>
<style type="text/css">
div.testa, div.testb, div.testc, div.testd, div.teste {border-color:#F00; border-width:3px}
div.testa {background:#DDD; border-style:dotted solid}
div.testb {background:#DDD; border-style:dotted solid solid solid}
div.testc {background:#DDD; border-style:dotted}
div.testd {border-style:dotted solid}
div.teste {background:#DDD; border-style:dotted double}
div.spacer {height:30px}
</style>
</head>
<body>
<div class="testa">testa (test failed - left and right border is not displayed)</div>
<div class="spacer"> </div>
<div class="testb">testb (test failed - left and right border is not displayed)</div>
<div class="spacer"> </div>
<div class="testc">testc (displayed properly - because all borders are dotted)</div>
<div class="spacer"> </div>
<div class="testd">testd (displayed properly - because of no background)</div>
<div class="spacer"> </div>
<div class="teste">teste (displayed properly - because left and right borders are double)</div>
</body>
</html>

daroc napisał(a):

Skorzystałem z propozycji Big_Z.
http://my.opera.com/community/forums/findpost.pl?id=2472491

Problem występuje także gdy górne i dolne obramowanie jest ustawione na double lub dashed. Próbowałem dodać kilka dodatkowych pasków, ale przy większej ich ilości nagle część z nich zaczęła się wyświetlać poprawnie. left