Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS] Środkowanie DIVa - ale inaczej
Forum PHP.pl > Forum > Przedszkole
asma1313
3.02.2012, 00:22:49
Witam. mam nastepujący problem. Wiem jak wysrodkowac diva za pomocą margin: auto; ale gdy to zrobie wyswietla mi oddatkową linijkę na górze okna, przez co div nie przylega do górnej krawędzi.
Dla lepszego zrozumienia:
Divy przed wyśrodkowaniem:
http://www.fotosik.pl/pokaz_obrazek/pelny/...c035959e93.html
Divy po wyśrodkowaniu:
http://www.fotosik.pl/pokaz_obrazek/pelny/...e779276b7b.html
jak widać wyśrodkowany div "przesunął" się w dół , naszedł na kolejny, ale tez nie trzyma sie górnej krawędzi.
Jak mogę to naprawić?

EDIT: faktycznie, juz wklejam.
CODE

<!--

#Table_01 {
margin: auto;
top:0px;
width:800px;
height:600px;
text-align: center;
}

#index-01_ {
margin: auto;
left:0px;
top:0px;
width:800px;
height:28px;
}

#index-02_ {
position:absolute;
left:0px;
top:28px;
width:800px;
height:100px;
}

#index-03_ {
position:absolute;
left:0px;
top:128px;
width:697px;
height:23px;
}

#index-04_ {
position:absolute;
left:697px;
top:128px;
width:103px;
height:23px;
}

#index-05_ {
position:absolute;
left:0px;
top:151px;
width:800px;
height:22px;
}

#index-06_ {
position:absolute;
left:0px;
top:173px;
width:800px;
height:154px;
}

#index-07_ {
position:absolute;
left:0px;
top:327px;
width:326px;
height:155px;
}

#index-08_ {
position:absolute;
left:326px;
top:327px;
width:474px;
height:155px;
}

#index-09_ {
position:absolute;
left:0px;
top:482px;
width:800px;
height:28px;
}

#index-10_ {
position:absolute;
left:0px;
top:510px;
width:800px;
height:38px;
}

#index-11_ {
position:absolute;
left:0px;
top:548px;
width:800px;
height:52px;
}

-->
</style>

CODE

<body style="background-color:#f38e0d">
<div id="Table_01">
<div id="index-01_">
<img id="index_01" src="images/index_01.gif" width="800" height="28" alt="" />
</div>
<div id="index-02_">
<img id="index_02" src="images/index_02.gif" width="800" height="100" alt="" />
</div>
<div id="index-03_">
<img id="index_03" src="images/index_03.gif" width="697" height="23" alt="" />
</div>
<div id="index-04_">
<img id="index_04" src="images/index_04.gif" width="103" height="23" alt="" />
</div>
<div id="index-05_">
<img id="index_05" src="images/index_05.gif" width="800" height="22" alt="" />
</div>
<div id="index-06_">
<img id="index_06" src="images/index_06.gif" width="800" height="154" alt="" />
</div>
<div id="index-07_">
<img id="index_07" src="images/index_07.gif" width="326" height="155" alt="" />
</div>
<div id="index-08_">
<img id="index_08" src="images/index_08.gif" width="474" height="155" alt="" />
</div>
<div id="index-09_">
<img id="index_09" src="images/index_09.gif" width="800" height="28" alt="" />
</div>
<div id="index-10_">
<img id="index_10" src="images/index_10.gif" width="800" height="38" alt="" />
</div>
<div id="index-11_">
<img id="index_11" src="images/index_11.gif" width="800" height="52" alt="" />
</div>
</div>

</body>


Pozdrawiam i Dziękuję za pomoc.



pablo_83
3.02.2012, 00:32:50
świetnie, wręcz super, tyle że znacznie łatwiej byłoby z jakimś kodem....
Koldy
3.02.2012, 01:25:33
ogólnie żeby wyśrodkować div'a to dajesz lewy i prawy margines na auto np:
Kod
margin: 0px auto;
,
Kod
margin: 0px auto 0px auto;

albo
Kod
margin-left: auto;
margin-right: auto;
asma1313
3.02.2012, 01:34:15
wiem, niestety, gdy tak robiłem efekt mialem jak na drugim zdjeciu.. DIV "odklejał" się od górnej krawedzi przegladarki
crocodillo
3.02.2012, 07:32:57
Tak jak napisał Koldy wyżej: margin: 0px auto 0px auto; (nie samo margin:auto;) margin:auto ustawia wszystkie marginesy na auto (góra, dół, lewy i prawy). Ew. może być jeszcze ustawiony margines w body, dlatego masz tą przerwę
by_ikar
3.02.2012, 08:28:10
Ale co chcesz dokładnie osiągnąć? Napisałeś że wyśrodkować - ok, wyśrodkowujesz, ale to nie jest efekt którego oczekiwałeś, więc jaki jest efekt którego oczekujesz? Mimo że wróżbitów szuka się tutaj coraz więcej, to niestety jest ich tutaj deficyt. Swoją drogą muszę pomyśleć o zmianie branży, bo widzę dość duży popyt jest we wróżbiarstwie, i przydałoby się ten segment jakoś wypełnić..
asma1313
3.02.2012, 21:31:50
by_ikar próbuję to wyśrodkować, ale uniknąć obniżenia divów, zeby zostały przy górnej krawędzi.
crocodillo i koldy: dzięki, zaraz spróbuję i dam znać czy pomogło

niestety, przy próbie srodkowania, caly czas robi mi odstep:/
ma ktoś jakieś pomysły?
toaspzoo
3.02.2012, 22:40:35
zrób w stylach na głównym elemencie:

[CSS] pobierz, plaintext 
  1.  
  2. position:relative; // lub fixed, jesli stala pozycja
  3. top: -10px; // przykladowo
[CSS] pobierz, plaintext


lub
[CSS] pobierz, plaintext 
  1. margin-top: -10px; // lub mniej / wiecej
[CSS] pobierz, plaintext
kw95s
3.02.2012, 22:58:52
spróbuj ustawić width:100%;
position:static;
margin:auto;
asma1313
3.02.2012, 23:05:33
ok, udało się ustawiając w body:
<div style="width:800px; text-align:left; margin-left:auto; margin-right:auto;">
i w css do kontenera nadrzednego text-align: center;
dziekuje za pomoc, temat do zamkniecia.
kw95s
4.02.2012, 00:13:11
zerknij jeszcze czy w każdej przeglądarce działa.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.