Rafał
Mazurkiewicz
serwisant - Niver
Niwińscy spj.j,
właściciel -
zlabs.pl
Temat: Dostosowanie CSS dla przeglądarek
Witam, wziąłem się za napisanie dla siebie prostej stronki, żeby zawiesić w sieci, i o ile w Firefoxie jest tak jak bym chciał (w sumie użyłem w CSSie kilku elementów, które tylko FF i pochodne obsługuje) to w żaden sposób nie wiem jak dostosować kod pod IE i reszte (opery, nie opery safari itp).Założenie jest takie:
Firefox
IE prezentuje to w ten sposób:
Internet Explorer.
CSS wygląda tak:
/*div.menu {border: 1px solid black; background: red;s -webkit-border-radius: 25px; -moz-border-radius: 25px; width: 140px; padding-left: 5px; padding-top: 2px; padding-bottom: 2px; padding-right: 5px; text-align:center;}*/
body {
margin: 0 auto;
/*background-color: #BFBFBF;*/
background-image: url(green-background.gif);
font-family: sans-serif; Tahoma; Verdana;
font-size: 12px;
}
/* DIVy */
div.left {
float: left;
background: white;
height: 100px;
width: 22%;
text-align: center;
margin-top: 40px;
margin-left: 10px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
}
div.content {
/*float: right;*/
/*margin-top: 100px;*/
margin-left: 25%;
margin-right: 30px;
background: white;
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 10px;
width: 70%;
height: 400px;
/*border: 5px solid #7FFF00;*/
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
}
div.title {
text-align: left;
font-size: 16px;
font-weight: bold;
margin-top: 5px;
margin-left: 5px;
}
div#footer {
clear: both;
text-align: right;
font-size: 10px;
margin-right: 30px;
}
/* NAVI */
#menu {
/*background: #800000;*/
position: relative;
margin-left: 24%;
padding: 0;
height: 20px;
/*border-left: 2px solid #800000;*/
/*border-right: 2px solid #800000;*/
margin-top: 10px;
/*margin-bottom: 10px;*/
}
#menu ul { position: absolute;
left: 20px; top: 0px; bottom: 0px;
font: bold 12px Georgia, "Times New Roman", Times, serif;
list-style: none;
margin: 0; padding: 0;
}
#menu li {
display: inline;
}
#menu li a {
text-align: center;
/*background: #800000;*/
float: left;
display: block;
padding: 2px 20px 2px 20px;
color: #000000;
text-decoration: none;
margin-left:1px;
width: 80px;
}
#menu li a:hover {
color: #006400;
background: #ffffff;
text-decoration: underline;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
}
#menu li a:active {
color: #006400;
background: #ffffff;
text-decoration: underline;
}
Był bym bardzo wdzięczny za pomoc :)
(tak, to IE uruchomione pod Fedorą 9 :P )Rafał Mazurkiewicz edytował(a) ten post dnia 22.11.08 o godzinie 23:41