[HTML][CSS]Wyśrodkowanie Div'ów Opcje

[oomaster]

Witam

Od niedawna przechodzę z tabelek na Divy bo podobno są lepsze mają wady i zalety ale do sedna.

Stworzyłem ładne bloki Div w których jest tekst i zdjęcie:

[HTML] pobierz, plaintext 
<div style="border: #dcdcdc 1px solid; padding:1px; font-size: 10px; width:120px; text-align:center;"><img src="foto/4.jpg"><br/>Studio Koloru Maxor</div>
[HTML] pobierz, plaintext 

Ładnie kopiuje i chcę ustawić bloki w rzędzie (obok siebie) a one przeskakują mi do nowej lini dlaczego ? Jak to naprawić ?

Ten post edytował oomaster 31.05.2008, 19:28:13

[piotrooo89]

spróbuj dodać
float: left;

[oomaster]

A jak można wyśrodkować grupę elementów ?

Kod

<div style="text-align:center">KOD HTML I INNE</div>

bo powyższe rozwiązanie nie działa :/

[piotrooo89]

chyba to:

margin-left: auto;
margin-right: auto;

[oomaster]

niestety nie działa

[empathon]

[HTML] pobierz, plaintext 
ul {
	margin: 0 auto 0 auto;
}
 
ul li {
	display: block;
	float: left;
	border: #dcdcdc 1px solid;
	padding:1px;
	font-size: 10px;
	width:120px;
	text-align:center;
}
 
<ul>
	<li><img src="foto/4.jpg" alt="zdjęcie"><br/>Studio Koloru Maxor</li>
</ul>
[HTML] pobierz, plaintext 

[oomaster]

Działa Ale wszystko na prawo się przykleiło zamiast na środek

Ten post edytował oomaster 28.05.2008, 21:40:57

[piotrooo89]

a co ty dokładnie chcesz zrobić? ono jest ok

Ten post edytował piotrooo89 28.05.2008, 21:41:14

[empathon]

A to ciekawe bo u mnie sprawdza się doskonale. Gdzie wstawiłeś CSS? Mam nadzieję, że nie bezpośrednio w ciało dokumentu ...

Edit: Proszę zaznaczaj gdzie edytujesz posta bo przez to nasze wypowiedzi tracą sens...
Ustal width dla ul.

[oomaster]

elementy w DIV wyśrodkować a text-align:center nie działa :/

chodzi o to:
<div>

tu będą divy z tym obrazkiem i tekstem

</div>

EDIT: no pewnie ,że nie wszystko dobrze wklejam

Ten post edytował oomaster 28.05.2008, 21:44:04

[piotrooo89]

to co napisał empathon to powinno chodzić

margin: 0 auto 0 auto ;

pokombinuj z tym...

[empathon]

To co chcesz zrobić to lista. Dla uzyskania porządanego efektu każdemu elementu listy "li" przypisujesz display: block;. Dzięki temu zachowuje się jak "div" - element blokowy. "text-align" nie działa na elementy blokowe bo jak sama nazwa wskazuje wyśrodkowuje tekst. Dlatego ustala się dla takiego elementu margin-left/right na auto co inaczej można zapisać przez margin: 0 auto 0 auto; ( top right bottom left ). Ustal szerokość dla listy "ul".

[pest]

Z tego co pamiętam to z w IE6 były problemy z margin:auto; w sensie, że nie działało. Jaką przeglądarką kolega sprawdza?

[oomaster]

Ale CSS jest bardzo dobrym rozwiązaniem dlatego chyba nikt kto tworzył CSS nie zapomniał o możliwości wyśrodkowania grupy Div'ów.

A poza tym w IE grupa div'ów leci mi na lewo. Nie wiem co jest grane już

[Shili]

Chcesz wyśrodkować divy z tym dodanym float: left czy jakieś inne?

Ze swojej strony poprosiłabym o kod.

[oomaster]

Chcę wyśrodkować elementy znajdującie się w divie mm

Fragment Kod Arkusza CSS:

Kod

div.miejsce{border: #dcdcdc 1px solid; padding:1px; font-size: 10px; width:120px; text-align:center; float: left; margin-left:3px; vertical-align: middle;}
div.mm{float: center;}

Fragment Kod Strony:

Kod

<div class="mm">

<div class="miejsce"><img src="foto/4.jpg" alt="zdjęcie"><br/>Studio Koloru Maxor</div>
<div class="miejsce"><img src="foto/4.jpg" alt="zdjęcie"><br/>Studio Koloru Maxor</div>
<div class="miejsce"><img src="foto/4.jpg" alt="zdjęcie"><br/>Studio Koloru Maxor</div>
<div class="miejsce"><img src="foto/4.jpg" alt="zdjęcie"><br/>Studio Koloru Maxor</div>

</div>

[MWL]

Oj, źle stoisz z CSS'em. Niema czegoś takiego jak div.mm{float: center;}. Jek chcesz to mozesz dac text-align:center; lub aby wycenterować diva nie w środku to div.mm{margin:auto;}

[oomaster]

żadne z tych rozwiązań nie działa sad.gif myślę nad standardowym paddingiem...

NIe ma na to rozwiązania ? :/