кофти изглед - табове

Pussycat

Registered
Здравейте !

Направих си следните табове:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style>
body {
background-color: #FFFFFF;
}
.nifty {
width: 100%;
background: #C5E100;
margin-top: -8px;
color: #FFFFFF;
}
b.rtop, b.rbottom {
display:block;
background: #FFF
}
b.rtop b, b.rbottom b {
display:block;
height: 1px;
overflow: hidden;
background: #C5E100;
}
b.r1 { margin: 0 5px }
b.r2 { margin: 0 3px }
b.r3 { margin: 0 2px }
b.rtop b.r4, b.rbottom b.r4 { margin: 0 1px;height: 2px }

.new {
padding: 5px 5px 5px 5px;
text-align: left;
color: #fff;
font-size: 15px;
font-family: arial, sans-serif, helvetica;
}
#tab {
width: 250px;
padding: 3px 3px 3px 33px;
float: left;
}
#big_tab {
width: 100%;
}
</style>

<title>Табове ;)</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<script type="text/javascript">
function changebackground(divid,glaven,text) {
var bk = document.getElementById(divid).style.backgroundColor;
var glaven = document.getElementById(glaven);
glaven.style.background = bk;
glaven.innerHTML = text;
}
</script>
</head>
<body>
<div id="tab">
<div class="nifty">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="new" onmouseover="changebackground('id1','bashboxa','текст текст текст текст')" id="id1">
1
</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</div>
<div id="tab">
<div class="nifty">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="new" onmouseover="changebackground('id2','bashboxa','текст2 текст2 текст2 текст2')" id="id2">
2
</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</div>
<div id="tab">
<div class="nifty">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="new" onmouseover="changebackground('id3','bashboxa','текст3 текст3 текст3 текст3')" id="id3">
3
</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</div>
<div id="big_tab">
<div class="nifty">
<b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b>
<div class="new" id="bashboxa">
4
</div>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</div>
</body>
</html>


Под IE са перфектни !
Ама под opera са голяяяма боза.

От какво се получава ?

Някакви идеи за оправянето им под всички браузъри ?

---
Ползвал съм този урок за база: http://web-tourist.net/login/login/view.php?st=1806

Все ми е тая, ако искате можете да ми покажите как да стане и с някой от тези: http://web-tourist.net/login/login/view.php?st=2123 , http://web-tourist.net/login/login/view.php?st=2094

Аз си поиграх, ама нещо не се получи, само на единия код успях да го докарам :roll:
 
въщност няма значение от кода какъв е, стига да се вижда така както при IE се вижда горепосочения сорс.
 

Back
Горе