Mam pytanie odnośnie jak wyśrodkować w poziomie coś takiego: - - - - - * * * * * - - - - - . Chodzi oczywiście o wyśrodkowanie elementów w jednej linii w poziomie względem siebie.
Zależy czym są te elementy. Jeśli to są osobne elementy dowolnego typu, to najprościej z flexboxem:
.container { display: flex; justify-content: center; }
<http://december.com/html/4/element/div.html class="container"> <http://december.com/html/4/element/div.html class="item">Jakiś element</http://december.com/html/4/element/div.html> <http://december.com/html/4/element/div.html class="item">Inny element</http://december.com/html/4/element/div.html> <http://december.com/html/4/element/div.html class="item">I jeszcze inny</http://december.com/html/4/element/div.html> </http://december.com/html/4/element/div.html>
niestety nie działa, nie poziomują się dla takiej zawartości:
<http://december.com/html/4/element/div.html class="container"> <http://december.com/html/4/element/div.html class="item"> - - - - - </http://december.com/html/4/element/div.html> <http://december.com/html/4/element/div.html class="item"> * * * * * </http://december.com/html/4/element/div.html> <http://december.com/html/4/element/div.html class="item"> - - - - - </http://december.com/html/4/element/div.html> </http://december.com/html/4/element/div.html>
Działa, działa Pokaż cały kod.
<http://december.com/html/4/element/style.html type="text/css"> .container { display: flex; justify-content: center; } </http://december.com/html/4/element/style.html> <http://december.com/html/4/element/div.html class="container"> <http://december.com/html/4/element/div.html class="item"> - - - - - </http://december.com/html/4/element/div.html> <http://december.com/html/4/element/div.html class="item"> * * * * * </http://december.com/html/4/element/div.html> <http://december.com/html/4/element/div.html class="item"> - - - - - </http://december.com/html/4/element/div.html> </http://december.com/html/4/element/div.html>
Domknąłeś tego div-a na końcu?
oczywiście już poprawiam post, ale i tak nie działa
A nie trzeba przypadkiem jakoś wypoziomować divy wzajemnie do siebie ?
Nie wiem jak Ty to testujesz, bo sprawdziłem w Chrome, Firefoksie i Safari i wszędzie jest na środeczku strony.
Przecież mi nie chodzi o środkowanie na stronie, ale wyraźnie napisałem że chodzi o wyśrodkowanie w poziomie wzajemnie wszystkich elementów,
Wyśrodkowanie na stronie to żaden problem,
No to nie wiem o co Ci chodzi. Narysuj.
Przecież to proste, chyba każdy wie jak wygląda poziom i jak pion, nie da się już prościej napisać niż wyśrodkowanie w poziomie wzajemnie elementów.
Jeśli chodzi Ci o stos, to to nie jest - cytuję: "wyśrodkowanie elementów w jednej linii w poziomie względem siebie.". To się nazywa wyśrodkowanie w osi pionowej.
.container { display: flex; flex-direction: column; align-items: center; }
Teraz mam elementy w pionie, kompletnie nie o to chodzi Chodzi u wyświetlenie wszystkich elementów w jednym poziomie, a nie pionie.
w poprzednie wersji elementy wyświetlały się w poziomie, ale nie były wzajemnie wyśrodkowane (gwiazdki były powyżej linii myślników, a mają być wzajemnie wyśrodkowane)
No to narysuj, bo naprawdę nie wiadomo o co Ci chodzi. Wyśrodkować w jednej linii względem siebie? Co to znaczy?
Aha, o to chodzi. Gwiazdka ma indeks górny, więc to normalne, że nie są równo. Masz co najmniej trzy wyjścia:
1. Poszukać innego znaczka, który nie ma indeksu górnego.
2. Pobawić się position: relative.
3. Użyć obrazków.
jest coś takiego : https://zapodaj.net/5be6ad1392474.gif.html
a chodzi o to : https://zapodaj.net/8b2b16f517d91.gif.html
czyli, za pomocą css nie da się tego uzyskać ?
Jeśli koniecznie muszą być gwiazdki, to daj elementom z gwiazdkami takie właściwości:
position: relative; top: .23em;
dzięki, jednak na szczęście da się w samym css, super
Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)