problem z css

HTML to podstawy w dziedzinie tworzenia stron WWW, Style CSS warto opanować, bowiem za ich pomocą można dostosować odpowiednio wygląd swojej witryny WWW. Zagłębiamy się dalej i udostępniamy w tym forum możliwość zadawania pytań o JavaScript.
ODPOWIEDZ
Sylwek44
Posty: 3
Rejestracja: pn lut 28, 2011 6:43 pm

problem z css

Post autor: Sylwek44 »

Witam

Jestem nowy i proszę o pomoc. Mama taką prostą stronkę i chcę ją wyśrodkować w przeglądarkach. Nie wiem jak to zrobić ???

Poniżej kod.

Będę wdzięczny za pomoc.

Pozdr
Sylwek44


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2" />

<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/slimbox.js"></script>
<link rel="stylesheet" href="css/slimbox.css" type="text/css" media="screen" />

</head>

<body onload="" style="font-size=10px; background-color:#ffffff;">

<div style="position: center"></div>

<div class="*" style="position: absolute; top:0px; left:350; width:1000px; height:25px;"><img src="images/index_01.gif" alt="" border="0" width="1000" height="25" ></div>


<div class="*" style="position: absolute; top:25px; left:350px; width:21px; height:891px;"><img src="images/index_02.gif" alt="" border="0" width="21" height="891"></div>


<div class="*" style="position: absolute; top:25px; left:371px; width:272px; height:130px;"><img src="images/index_03.gif" alt="" border="0" width="272" height="130"></div>


<div class="*" style="position: absolute; top:25px; left:643px; width:707px; height:130px;" align="center"><img src="images/index_04.gif" alt="" border="0" width="707" height="130"></div>


<div class="*" style="position: absolute; top:155px; left:371px; width:272px; height:103px;"><img src="images/index_05.gif" alt="" border="0" width="272" height="103"></div>


<div class="*" style="position: absolute; top:155px; left:643px; width:165px; height:47px;"><a href="index.php?ppg=1" ><img src="images/index_06.gif" alt="" border="0" width="165" height="47"></a></div>


<div class="*" style="position: absolute; top:155px; left:808px; width:110px; height:47px;"><a href="index.php?ppg=2" ><img src="images/index_07.gif" alt="" border="0" width="110" height="47"></a></div>


<div class="*" style="position: absolute; top:155px; left:918px; width:132px; height:47px;"><a href="index.php?ppg=3" ><img src="images/index_08.gif" alt="" border="0" width="132" height="47"></a></div>


<div class="*" style="position: absolute; top:155px; left:1050px; width:190px; height:47px;"><a href="index.php?ppg=4" ><img src="images/index_09.gif" alt="" border="0" width="190" height="47"></a></div>


<div class="*" style="position: absolute; top:155px; left:1240px; width:110px; height:47px;"><a href="index.php?ppg=5" ><img src="images/index_10.gif" alt="" border="0" width="110" height="47"></a></div>


<div class="*" style="position: absolute; top:202px; left:643px; width:707px; height:11px;"><img src="images/index_11.gif" alt="" border="0" width="707" height="11"></div>


<div class="*" style="position: absolute; top:213px; left:643px; width:7px; height:703px;"><img src="images/index_12.gif" alt="" border="0" width="7" height="703"></div>


<!----- <div style="background-image: url('lokalizacja_obrazka'); height: wysokoœć_obrazka; width: szerokoœć obrazka;"> Text na obrazku</div> -------->
<div class="*" style="position: absolute; top:212px; left:650px; width:696px; height:658px;">

<table width="100%" height="100%" border="0" background="images/index_13.gif">
<tr>
<td height="703">
<br>

tu jakiś tekst !!!

</td>
</tr>
</table>



</div>


<div class="*" style="position: absolute; top:213px; left:1344px; width:6px; height:703px;"><img src="images/index_14.gif" alt="" border="0" width="6" height="703"></div>


<div class="*" style="position: absolute; top:257px; left:371px; width:18px; height:658px;"><img src="images/index_15.gif" alt="" border="0" width="18" height="658"></div>


<div class="*" style="position: absolute; top:258px; left:389px; width:237px; height:51px;"><a href="index.php?ppg=6" ><img src="images/index_16.gif" alt="" border="0" width="237" height="51"></a></div>


<div class="*" style="position: absolute; top:258px; left:626px; width:17px; height:59px;"><img src="images/index_17.gif" alt="" border="0" width="17" height="59"></div>


<div class="*" style="position: absolute; top:309px; left:389px; width:237px; height:8px;"><img src="images/index_18.gif" alt="" border="0" width="237" height="8"></div>


<div class="*" style="position: absolute; top:317px; left:389px; width:238px; height:51px;"><a href="index.php?ppg=7" ><img src="images/index_19.gif" alt="" border="0" width="238" height="51"></a></div>


<div class="*" style="position: absolute; top:317px; left:627px; width:16px; height:599px;"><img src="images/index_20.gif" alt="" border="0" width="16" height="599"></div>


<div class="*" style="position: absolute; top:368px; left:389px; width:238px; height:8px;"><img src="images/index_21.gif" alt="" border="0" width="238" height="8"></div>


<div class="*" style="position: absolute; top:376px; left:389px; width:238px; height:51px;"><a href="index.php?ppg=8" ><img src="images/index_22.gif" alt="" border="0" width="238" height="51"></a></div>


<div class="*" style="position: absolute; top:426px; left:389px; width:238px; height:8px;"><img src="images/index_23.gif" alt="" border="0" width="238" height="8"></div>


<div class="*" style="position: absolute; top:434px; left:389px; width:238px; height:51px;"><a href="index.php?ppg=9" ><img src="images/index_24.gif" alt="" border="0" width="238" height="51"></a></div>


<div class="*" style="position: absolute; top:485px; left:389px; width:238px; height:8px;"><img src="images/index_25.gif" alt="" border="0" width="238" height="8"></div>


<div class="*" style="position: absolute; top:493px; left:389px; width:238px; height:51px;"><a href="index.php?ppg=10" ><img src="images/index_26.gif" alt="" border="0" width="238" height="51"></a></div>


<div class="*" style="position: absolute; top:544px; left:389px; width:238px; height:8px;"><img src="images/index_27.gif" alt="" border="0" width="238" height="8"></div>


<div class="*" style="position: absolute; top:552px; left:389px; width:238px; height:51px;"><a href="index.php?ppg=11" ><img src="images/index_28.gif" alt="" border="0" width="238" height="51"></a></div>


<div class="*" style="position: absolute; top:603px; left:389px; width:238px; height:8px;"><img src="images/index_29.gif" alt="" border="0" width="238" height="8"></div>


<div class="*" style="position: absolute; top:612px; left:623px; width:5px; height:304px;"><img src="images/index_30.gif" alt="" border="0" width="5" height="304"></div>


<div class="*" style="position: absolute; top:610px; left:391px; width:1px; height:304px;"><img src="images/index_30.gif" alt="" border="0" width="1" height="304"></div>


<div class="*" style="position: absolute; top:611px; left:389px; width:237px; height:51px;"><a href="index.php?ppg=12" ><img src="images/index_31.gif" alt="" border="0" width="237" height="51"></a></div>


<div class="*" style="position: absolute; top:661px; left:389px; width:237px; height:253px;"><img src="images/index_32.gif" alt="" border="0" width="237" height="253"></div>


<div align="center"></div>
<div class="*" style="position: absolute; top:913px; left:350px; width:1000px; height:84px;"><img src="images/index_33.gif" alt="" border="0" width="1000" height="84"></div>

</body>
</html>
www.skrypty.pro
Nowy
Nowy
Posty: 128
Rejestracja: czw lis 04, 2010 9:41 am
Lokalizacja: www.skrypty.pro
Kontakt:

Re: problem z css

Post autor: www.skrypty.pro »

<div style="position: center"></div>

Masz otwartego diva z pozycją center ,ale zaraz go zamykasz. Spróbuj może tak :
<div style="position: center">

cała reszta strony

</div>
Sylwek44
Posty: 3
Rejestracja: pn lut 28, 2011 6:43 pm

Re: problem z css

Post autor: Sylwek44 »

Niestety to nie daje rezultatu.
www.skrypty.pro
Nowy
Nowy
Posty: 128
Rejestracja: czw lis 04, 2010 9:41 am
Lokalizacja: www.skrypty.pro
Kontakt:

Re: problem z css

Post autor: www.skrypty.pro »

Zwróć uwagę na to, że we wszystkich obrazkach masz wpisany atrybut absolute. Zmień może na relative i potem próbuj wyśrodkować.
Sylwek44
Posty: 3
Rejestracja: pn lut 28, 2011 6:43 pm

Re: problem z css

Post autor: Sylwek44 »

niestety to nic nie daje. :(
jamart
Nowy
Nowy
Posty: 23
Rejestracja: czw gru 16, 2010 2:10 pm

Re: problem z css

Post autor: jamart »

jeżeli chcesz wyśrodkować div który u Ciebie w stylach ma "position: center" to przede wszystkim trzeba nadać mu szerokość - domyślnie div ma szerokość kontenera (tutaj kontenerem dla tego div jest body) czyli nie ma jak wyśrodkować.

proponuję by ustawić div tak:
<div style="width: 1000px; margin: 0 auto;" > ... </div>

opcja z margin left i right na auto nie działa co prawda pod IE6 ale poradzić z tym sobie można ustawiając tutaj w body "text-align: center" a do div o którym mowa ustawić dodatkowo "text-align: left";

(nie mówiąc już że układanie contentu strony za pomocą position:absolute; oraz wartościami top i left jest dla mnie totalnie bez sensu - ale akurat to nie jest tutaj istotne)
ODPOWIEDZ