Jak mogę wyśrodkować elementy blokowe ?? Mam sobie kilka div'ów, każdy układa się w float: left i te wszystkie div'y są w jednym, który ma text-align: center; margin: 0 auto; ... nie śmiga...
0
0
Z tego co ja rozumiem to chcesz wyśrodkować bloki ,tak...??Jeśli tak ,to mam dla ciebie złą wiadomość.W ten sposób tego nie zrobisz , bo ... bo się nie da! Jak można wyśrodkować elementy za pomocą text-align: center ?? Tego sie używa do wyśrodkowania tekstu.
Poczytaj o pozycjonowaniu za pomocą CSS oraz o wyrównywaniu elementów blokowych.
0
Centrowanie divów z float nie jest najprostsze i najlogiczniejsze, ale możliwe: centering floating divs.
Warto zwrócić uwagę na to, że mamy prawie 2013 i nie przejmujemy się już 12 letnimi IE, więc zapewne spokojnie możesz użyć właściwości display: inline-block;, która w zachowaniu jest bardzo zbliżona do float: left w większości zastosowań, w których się floatowania używa, natomiast można ją centrować poprzez text-align: center;. Pamiętaj tylko, żeby pomiędzy kolejnymi elementami z inline-block nie wstawiać białych znaków, bo to rozsunie Ci elementy o parę pixeli, czyli takie coś jest ok:
<div id="nadrzedny" style="text-align: center;">
<div>1111
</div><div>
222</div><div>
3333</div>
</div>
ale takie nie:
<div id="nadrzedny" style="text-align: center;">
<div>1111</div>
<div>222</div>
<div>3333</div>
</div>
Czyli pomiędzy elementami zamykającymi/otwierającymi z inline-block - żadnej przerwy.
I małe demo:
http://jsbin.com/ecidad/1/
0
@dzek69, efekt niemal, że osiągnięty... tylko w tym przypadku: http://jsbin.com/ecidad/3/edit jak zrobić, żeby dupa z czarnym backgroundem była po lewej stronie, w pierwszej kolumnie ?? :/ Kafelki (bo tak mogę je nazwać) mają układać się z lewej do prawej i jednocześnie mają być wyśrodkowane -
0
Ot dokładasz diva otaczającego całość, tamten niech układa do lewej, ten nowy, wyżej - do środka. Oczywiście ten poprzednio nadrzędny żeby się dał ładnie środkować to też niech ma inline-block (choć równie dobrze może mieć block i margin: auto).
0
Co jest nie tak z kodem: http://jsbin.com/ecidad/8 , dalej nie działa...
0
Po raz setny na tym forum powtarzam, Tobie pewnie też: ID JEST WARTOŚCIĄ UNIKALNA!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
Na jeden dokument HTML przypada JEDEN element o danym ID
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
!!!!!!!!!!!!!!!!!!!!!
// Choć to nie jest błąd, który powoduje, że Ci nie działa to jak oczekujesz - masz szczęście, że przeglądarki ogarniają takie błędy.
A nie działa Ci dlatego, że kompletnie nie zastosowałeś się do mojego ostatniego posta.. Napisałem, żeby to otoczyć jeszcze jednym divem - u Ciebie tego w ogóle nie ma. Regułki powinny być 3:
Otaczający element #1
Otaczający element #2
Kafelki
U Ciebie już po ilości regułek widać, że nie zrobiłeś tego, o czym mówiłem.
0
ale o jakie dokładnie chodzi ID ?? entry ? dlaczego nie można powtarzać ? i czym w takim razie to zastąpić ? bo nie rozumiem problemu...
0
Napisałem - to nie jest błąd mający związek z Twoim problemem, ale jest to błąd, i tak, powinieneś to zastąpić przez class.
Edit: a z Twoim problemem - czy ta strona ma mieć taką dynamiczną szerokość? Na stałej szerokości #gale1 nie będzie problemu, na dynamicznej - muszę ogarnąc.
Edit2: Wszystkie znane mi techniki poprzez czysty css na osiągnięcie efektu, o którym mówisz wymagają albo stałej szerokości elementu #gale1, albo, żeby elementów nie było więcej niż 1 linia (co - jak wiemy - odpada). Zostaje javascript, jeżeli nie pasuje Ci ustalenie szerokości na stałe.
0
Tak, wiem masz rację z tym ID, mój błąd, semantyka się kłania. Jednakże przerobiłem kod: http://jsbin.com/ecidad/14/edit i proszę, nie działa
0
nie chcę mieć dwóch kolumn :/ chodzi o dynamiczną zmianę zawartości ;p więc kod jak dla mnie jest nietrafiony ;p
0
To nie chodzi o semantykę, to chodzi o "dziwne błędy", które Ci się będą robić jak będziesz chciał dopisać coś w JavaScripcie.
I błagam, czytaj moje posty. Jesteś jedną z osób, której muszę pisać kilometrowe posty i nic z tego nie wynika ---- dodajesz albo sztywną szerokość do #gale1, albo pomagasz sobie javascriptem, innej metody nie widzę, na osiągnięcie tego efektu, chyba, że ktoś inny coś wymyśli, ale pewnie nie, przepatrzyłem już wszystkie podobne techniki.
0
JavaScript, a w co dokladnie iść ? Jak nie to wstawię tabele i kij ;/
0
Tabela Ci tu nie pomoże, bo jej komórki będą w jednym wierszu przecież, chyba, że ręcznie wstawisz <tr>, ale to wtedy nie ma sensu, bo przepada dynamiczna szerokość.
0
Jakich funkcji mam szukać w JS albo jQuery? Orientujesz się ?
1
W sumie to jeszcze są css media queries.
Osobne style dla określonych szerokości ekranu: http://css-tricks.com/css-media-queries/
Ponieważ Twoje kafelki mają określoną szerokość, to ich rodzic będzie miał tylko parę kombinacji w jakich to będzie miało sens, np:
300px, 600px, 900px, 1200px,
tak więc używając media queries możesz wpisać parę wartości, powiedzmy do szerokości 2000, bo mało kto i tak ma szerszy monitor (tak, wiem, że mają, jak chcesz to rób i dla 4000, ale zwykle stron nie robi się już tak szeroko).
Ale już mnie się nie chce pisać kolejnych kilometrowych postów, poczytaj, zastanów się, wyciągnij wnioski i powodzenia :)
Edit: Jeżeli chodzi o javascript - to funkcji w zasadzie żadnych. Nauczyć się odpalać skrypty po załadowaniu strony, nauczyć się wybierać elementy DOM, potem matematyka (dodawanie, odejmowanie, dzielenie, mnożenie) i zastosowanie stylu CSS do elementu. Aha, i zdarzenie wykrywające zmianę rozmiaru okna przeglądarki - żeby przeliczyć szerokości wtedy.
Możesz połączyć media queries + javascript (jakby przeglądarka nie ogarniała jednego to ogarnie drugie może)
0
ok, dzięki i tak dużo mi pomogłeś ;) przecież też nie żądam gotowego rozwiązania :)
0
A jak nie to wstawie kafelki jako*.png :) i naniosę na nie text i też będzie dobrze, bo jak css media queries nie działa w każdej przeglądarce, a JS często jest wył. w przeglądarce to może i najłatwiejsze, ale i zarazem najlepsze wyjście :D ale poczytam i tak :) css media queries już ogarnąłem :) napiszę jutro obsługę na razie idę oglądać film :p
0
Nie widzę w jaki sposób umieszczenie kafelków jako obrazki cokolwiek tu zmieni, ale ok..