ziom32
(Ziom32)
30 Maj 2009 17:32
#1
Witam
Pierwszy problem polega na tym że moja strona robiona na divach nie wygląda tak samo w przeglądarce IE.
Tzn w divie nadrzędnym(zawartość całej strony) ustawiam:
Obraz toptlo.jpg ma wymiary 1x300px jest gradientem u góry czarnym a na dole białym i później zgrywa się z tłem.
W Firefoxie i w Operze wszystko jest zgodnie z planem i ładnie to wygląda.
Ale w IE tło na całej stronie jest takie jak tło body czyli czarne:/
Drugi problem polega na tym, że mam problem z prawidłowym wstawieniem filmików z youtube.
Strona robiona jest w XHTML 1.0 Transitional. Gdy wstawię ten link z youtube z pozycji ‘umieść’ to wywala mi kilkanaście błędów. Jak poprawnie trzeba to zrobić?
Z góry dzięki za pomoc.
Nigdy nie zajmowałem się profesjonalnie tworzenie stron, ale to jest normalne, że strony wyglądają różnie w różnych przeglądarkach. Wydaje mi się, że najprościej jest zrobić dwie wersje szablonu… jedną pod IE a inną pod resztę. Napisz jeszcze w jakich wersjach są przeglądarki.
Za dużo kodu to nie podałeś.
Spróbuj dodać do tego
overflow:auto;
Jak nie zadziała to zapodaj więcej kodu html+ css
Poszukaj na forum jakiś czas temu ktoś miał podobne problemy i jak się nie mylę otrzymał odpowiedź (zakładam że chodzi o validator #-o )
ziom32
(Ziom32)
30 Maj 2009 18:00
#4
http://wklejto.pl/34742 -tresc
body{ background:black ; color: navy ; margin:0; } html{ background:black; color: navy; margin:0; } img{ border:0; } a{ text-decoration:none; } a.roz{ color:navy; font-family: “Times New Roman”, Times, serif; font-size:12pt; } a.roz:link{ color:navy; } a.roz:visited{ color:navy; } a.roz:hover{ color: orange; text-decoration:none; } img.postac{ padding: 10px; vertical-align:text-top; float:left; } p{ margin-left:0.4cm; margin-right:0.4cm; color:navy; font-family: “Times New Roman”, Times, serif; font-size:12pt; } h1{ margin-left:0.4cm; margin-right:0.4cm; text-align:center; color: maroon; font-size:24pt; font-family: “Times New Roman”, Times, serif; } h2{ margin-left:0.5cm; margin-right:0.5cm; color:navy; text-align:center; font-size:18pt; font-family: “Times New Roman”, Times, serif; } form{color:navy; margin-left:15px; font-family: “Times New Roman”, Times, serif; font-size:12pt; } ul.lm li { display: block; list-style: none; margin: 0; padding: 1px; } ul.lm { display: block; list-style: none; margin: 0; padding: 1px; } a:link{ color:white; } ul.lm a:visited{ color:white; } ul.lm a:hover{ color: #BFDBFF ; text-decoration:none; } ul.rozrywka li{ color:navy; font-family: “Times New Roman”, Times, serif; font-size:12pt; } #top { border:solid #359dfd 3px; background:white url(toptlo.jpg)repeat-x; width:780px; margin-left:auto; margin-right:auto; overflow:auto; } #baner { height:200px; background:url(banerr.jpg); text-align:center; background-color:navy; width:780px; clear: both; } #gmenu { background-image:url(tlomenu1.jpg); text-align:center; height:40px; } #lmenu { font-family:“Bookman Old Style”; color:white; font-size:10pt; font-weight:bold; background:url(ltlo.jpg)repeat-y; margin-top:5px; margin-bottom:5px; text-align:center; width: 165px; float: left; } #tresc { width: 610px; float: left; margin-bottom:10px; } div.galeria{ width:30%; padding:10px; float:left; text-align:center; } div.przerwa{ width:100%; clear:both; height:0px; } #stopka { color:white; font-size:12px; text-align:center; height:50px; clear: both; width: 780px; background:url(tlostopka.jpg) } #stopka a{ text-decoration:none; color:white; font-size:12px; } #stopka a:hover{color:yellow;}
Plik CSS
– Dodane 30.05.2009 (So) 20:00 –
http://wklejto.pl/34742 -tresc
body{ background:black ; color: navy ; margin:0; } html{ background:black; color: navy; margin:0; } img{ border:0; } a{ text-decoration:none; } a.roz{ color:navy; font-family: “Times New Roman”, Times, serif; font-size:12pt; } a.roz:link{ color:navy; } a.roz:visited{ color:navy; } a.roz:hover{ color: orange; text-decoration:none; } img.postac{ padding: 10px; vertical-align:text-top; float:left; } p{ margin-left:0.4cm; margin-right:0.4cm; color:navy; font-family: “Times New Roman”, Times, serif; font-size:12pt; } h1{ margin-left:0.4cm; margin-right:0.4cm; text-align:center; color: maroon; font-size:24pt; font-family: “Times New Roman”, Times, serif; } h2{ margin-left:0.5cm; margin-right:0.5cm; color:navy; text-align:center; font-size:18pt; font-family: “Times New Roman”, Times, serif; } form{color:navy; margin-left:15px; font-family: “Times New Roman”, Times, serif; font-size:12pt; } ul.lm li { display: block; list-style: none; margin: 0; padding: 1px; } ul.lm { display: block; list-style: none; margin: 0; padding: 1px; } a:link{ color:white; } ul.lm a:visited{ color:white; } ul.lm a:hover{ color: #BFDBFF ; text-decoration:none; } ul.rozrywka li{ color:navy; font-family: “Times New Roman”, Times, serif; font-size:12pt; } #top { border:solid #359dfd 3px; background:white url(toptlo.jpg)repeat-x; width:780px; margin-left:auto; margin-right:auto; overflow:auto; } #baner { height:200px; background:url(banerr.jpg); text-align:center; background-color:navy; width:780px; clear: both; } #gmenu { background-image:url(tlomenu1.jpg); text-align:center; height:40px; } #lmenu { font-family:“Bookman Old Style”; color:white; font-size:10pt; font-weight:bold; background:url(ltlo.jpg)repeat-y; margin-top:5px; margin-bottom:5px; text-align:center; width: 165px; float: left; } #tresc { width: 610px; float: left; margin-bottom:10px; } div.galeria{ width:30%; padding:10px; float:left; text-align:center; } div.przerwa{ width:100%; clear:both; height:0px; } #stopka { color:white; font-size:12px; text-align:center; height:50px; clear: both; width: 780px; background:url(tlostopka.jpg) } #stopka a{ text-decoration:none; color:white; font-size:12px; } #stopka a:hover{color:yellow;}
Plik CSS
Wrzuć stronę gdzieś na serwer to będzie wiadomo co i jak. Co do YT i xhtml to szukaj, na forum jest odpowiedź.
z4nzi
(Mariuszs)
30 Maj 2009 20:31
#6
Co do filmów YouTube: http://www.harv.pl/poprawne-osadzanie-f … utube.html
Co do tła, zmień na:
background: url(toptlo.jpg) repeat-x top left white;
Może też to być problem z automatyczną wysokością, ale zobaczymy…