PDA

Zobacz pełną wersję : Problem z CSS pod IE



Sztech
02-07-2010, 23:04
Witam,

mam problem ze stroną Szambometr.pl . Pod FF wszystko gra ale pod IE strona nie jest wyśrodkowana a galeria w dziale o produkcie jest rozjechana, podobnie jak tło w tym dziale. Proszę was koledzy o pomoc. Oto CSS:


body {
margin: 0px;
background: #000000;
padding:0px;
float: center;
}

body, td, th {
font-family: Andale mono, sans-serif;
font-size: 11px;
color: #000000;
line-height: 160%;

}
p {
font-family: helvetica;
font-size: 12px;

}
h1, h4, h5, h6 {
font-size: 12px;
color: #fff;
font-weight: normal;
}

h4 {
font-size: 11px;
font-weight: bold;
margin: 0;
padding: 0;
color: #FF9900;
margin-left: 2px;
}
h2 {
color: #ffffff;
font-weight: normal;
font-size: 30px;
text-transform: uppercase;
margin:0;
padding:0;
font-family: Candara, Arial, Helvetica, sans-serif;
line-height: 32px;
}


h3 {
color: #990000;
font-weight: normal;
font-size: 12px;
text-transform: none;
margin-bottom: 10px;
padding-top: 0;
margin-top: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
a {
color: #1F6BB2;
}
a:hover {
color: #FFF;
}
.container {
width: 950px;
margin: 0 auto;
}
#contentarea {
width: 950px;
clear: left;
margin-top: 0;
float: left;
padding-bottom: 30px;
background:#F1F1F1;
font-family: Andale mono;
background-image: url('http://www.swc.drl.pl/SZTECH/www/images/stories/SZTECH/to%20artykulow950.png');



}
#top {
width: 100%;
height: 90px;
}
#top-cover {
width: 950px;
margin: 0 auto;
}
#logo {
width: 200px;
float: left;
margin-top: 15px;
margin-left: 5px;
}
#header {
width: 950px;
float: left;
display: inline-block;
margin-bottom: 20px;
}
#content {
width: 630px;
float: left;
margin-top: 20px;
margin-left: 20px;
}
#content2 {
width: 850px;
float: left;
margin-top: 20px;
margin-left: 20px;
}
#right {
width: 255px;
float: right;
padding-bottom: 70px;
margin-top: 20px;
color: #666;
margin-right:15px;
}
#right .moduletable {
margin-bottom: 20px;
}
#bottom {
width: 950px;
clear: left;
float: left;
color: #666;
background:#000000;
padding:0 0 20px;
}
#right h3, #bottom h3 {
margin: 0px;
font-weight: bold;
color: #1F6BB2;
font-size: 18px;
font-family:"Trebuchet MS", Tahoma, Arial, Helvetica, Sans-serif;
border-bottom:5px solid #242424;
padding:0 0 5px 0;
}
#user1 {
width: 285px;
float: left;
margin-left: 15px;
}
#user1 .moduletable {
margin-bottom: 5px;
padding-bottom: 5px;
}
#user1 p {
margin: 0;
padding: 0;
margin-left: 2px;
}
#user1 a {
color: #FF9900;
}
#user2 {
width: 285px;
float: left;
margin-left: 50px;
}
#user2 li {
margin: 0;
padding: 0;
list-style: none;
list-style-image: none;
text-transform: none;
line-height: 18px;
}
#user2 a {
color: #666;
margin-left: 2px;
font-size: 11px;
}
#user3 {
width: 285px;
float: right;
margin-right: 0px;
}
#footer {
clear: left;
float: left;
width: 950px;
text-align: left;
font-size: 9px;
padding: 10px 0 30px 10px;
color: #666;
}
#footer a {
color: #666;
}
#footer .moduletable {
width: 880px;
margin: 0 auto;
margin-top: 3px;
}
h2.contentheading, h2.componentheading {
margin-bottom: 20px;
margin-top: 10px;
}
.clear {
clear: both;
}
/* COMMON TAGS */
.modifydate {
color: #C0C0C0;
}
.author {
color: #C0C0C0;
}
.createdate {
color: #C0C0C0;
}
.contenttoc {
margin: 5px;
}
ul {
margin: 2px;
padding: 6px;
padding-left: 15px;
}
li {
padding-left: 1px;
line-height: 150%;
}
ul.arrow1 li, ul.arrow2 li {
padding-left: 5px;
padding-bottom: 2px;
padding-top: 2px;
}
.buttons {
float:right;
width:85px;
}
.buttons .buttonheading {
float:left;
}
.buttons img {
border: 0;
}
fieldset {
border: none;
}
textarea, input {
border: solid 1px #ccc;
color: #666;
}
.button {
background: none;
border: solid 1px #ccc;
color: #990000;
}
/* Poll Module Styles */

.poll-radio {
padding:0;
float:left;
clear:left;
text-align:left;
}
.poll-option {
float:left;
padding-bottom:6px;
padding-top: 3px;
width:85%;
margin-left: 2px;
}
.poll h3 {
border:none;
}
.author, .createdate, .modifydate, .buttons {
display:none
}

#topmenu {
float: right;
width:650px;
height: 61px;
margin-top:30px;
margin-right: 10px;
}

#topmenu ul, #topmenu ul li {
display: inline;
list-style: none;
margin: 0;
padding: 0;
float: right;
}
#topmenu ul li {
display: inline;
white-space: nowrap;
float: left;
font-weight: bold;
font-size: 14px;
padding-right: 20px;
padding-left: 20px;
padding-top: 2px;
line-height: 26px;
text-transform: uppercase;
font-family: Candara, Arial, Helvetica, sans-serif;
}
#topmenu li a {
padding: 0;
font-weight: normal;
text-decoration: none;
color: #fff;
}
#topmenu li:hover, #topmenu li.hover {
position: static;
}
#topmenu li a:hover, #topmenu li.active a {
color: #1F6BB2;
background-position: center;
}
html>body #topmenu li a {
width: auto;
}
.spotlight {
padding:15px 15px 0 15px;
}

a_m
02-07-2010, 23:16
zobacz źródło swojej strony; poczytaj o prawidłowej strukturze dokumentów

Sztech
02-07-2010, 23:26
HTML źrudłowy do czysty szablon myBusiness (http://www.bestofjoomla.com/component/option,com_bestoftemplate/task,detail/Itemid,46/id,2179/), a ten wygląda ok pod IE. Czy da się to jakoś na szybko naprawić? Sprawa jest o tyle pilna że jest to strona firmy i trochę wygląda to niepoważnie. prubowałem samemu to naprawiać ale totalnie mi nie idzie.

zwiastun
02-07-2010, 23:45
@a_m podał Ci powód. Naprawić się da. Poczytaj, co zaproponował a_m!

Sztech
03-07-2010, 00:00
Nie łapie, jak dla mnie mówicie trochę zbyt zagadkowo. Sprawdziłem plik html i tam wszystko na moje oko wyglada ok, Nic poza paroma metadanymi nie zmieniałem ( kod google Analitycs itp). Trochę miałem okazji poczytać o strukturze dokumentów. Z reszta wszystkie bloki i klasy widać dobrze w Firebug. Gdybym umiał sobie sam z tym poradzić nie pisał bym na forum, nie mam w zwyczaju zawracać ludziom głowy błahostkami. Niestety godziny spędzone przy edycji CSS nic nie dały stąd mój post. jeżeli chcecie abym coś przeczytał żeby nie liczyć na to że ktoś mi poda roziwązanie na tacy to ok, ale dajcie chociaż namiar na to co dokładniej zwrócić uwagę.

zwiastun
03-07-2010, 00:42
@a_m napisał Ci: zobacz źródło swojej strony; poczytaj o prawidłowej strukturze dokumentów
Masz pokopaną strukturę dokumentu. W efekcie IE wchodzi w tryb quirks. Tłumaczenie tego to tłumaczenie laikowi, jak wyrżnąć wyrostek robaczkowy. W materiałach o szablonach na http://pomoc.joomla.pl znajdziesz stosowne omówienie

Sztech
03-07-2010, 11:56
Czy jesteście pewni że tą galerię można naprawić z poziomu CSS? Wygląda mi na to że div class="imageSliderViewportArea imageSliderScrollableViewportArea imageSliderViewportAreaRow" ma szerokość 1078pw i dlatego przeskakuje baner z prawego modułu. Nie zabardzo wiem jak ta szerokośc zmienić bo to chyba jest zapisane gdzieś wewnątrz pluginu Sigplus gallery. Jeżeli chodzi o uslawienie ikon w pionie to już nie mam bladego pojęcia. poczytałem trochę to co mo podesłaliście. udało mi się wyśrodkować tą stronę. Bardzo bym prosił o pomoc z ta galerią bo żona już się wpiekla na mnie że przy dziecku nie pomagam tylko przed kompem siedzę. A nie odejde zanim tego nie poprawie ;)