W jaki sposób mogę wyśrodkować tekst bezwzględnego położenia wewnątrz względnego rodzica cieczy? Próbuję użyć text-align:center
na elementach nadrzędnych, ale zawsze centruje lewy róg dziecka, a nie sam element.CSS: centrowanie bezwzględnego tekstu umieszczonego wewnątrz względnego rodzica
7
A
Odpowiedz
18
Chodzi o to, że position:absolute;
modyfikuje szerokość elementu, aby dopasować jego zawartość i że text-align: center;
centra tekst wewnątrz bloku szerokości elementu. Więc jeśli dodasz position: absolute;
, nie zapomnij o zwiększeniu szerokości elementu, inaczej właściwość text-align: center;
będzie bezużyteczna.
Najlepszym sposobem rozwiązania tego problemu jest dodanie width: 100%;
i left: 0px;
w sekcji .text.
0
Aktualizacja: Co kładę przed była zła/zły
To powinno być znacznie bliżej do tego, co chcesz?
Twój tekst jest względny, a pozostałe elementy wewnątrz kontenera są bezwzględne!
.text {
color:#fff;
padding:50px 0;
display:block;
position:relative;
}
.absolute {
background:#f0f;
height:25px; width:25px;
position:absolute;
top:36px; left:50%;
}
Powiązane problemy
- 1. Centrowanie podmenu poziomą poniżej rodzica z css
- 2. Tajemnica bezwzględnego pozycjonowania CSS
- 3. Pole tekstowe - centrowanie tekstu
- 4. Bezwzględne pozycjonowanie wewnątrz względnego pozycjonowania?
- 5. Centrowanie absolutne CSS
- 6. Jak zmienić szerokość i wysokość bezwzględnego obrazu umieszczonego w div przez css: przed
- 7. Pionowe centrowanie wielu elementów div w rodzica div
- 8. Centrowanie bloku wbudowanego DIV
- 9. Jak mogę zmienić element nadrzędny odsunięcia bezwzględnie umieszczonego elementu CSS?
- 10. CSS - wybierz element bez tekstu wewnątrz
- 11. Centrowanie tekstu dużej czcionki w TextView
- 12. CSS Ponowne centrowanie elementów na opakowaniu
- 13. Angular2: dwukierunkowy wiązania wewnątrz elementu rodzica/dziecko
- 14. css przerwy pozycjonowania względnego dział do nowej linii
- 15. Jak sformatować kolor tła dla umieszczonego bloku tekstu?
- 16. Obcięcie tekstu wewnątrz div
- 17. Potrzebuję ustalonego pozycjonowanego elementu div wewnątrz bezwzględnie umieszczonego elementu div
- 18. Względny rodzic DIV dziedziczy szerokość bezwzględnego dziecka DIV
- 19. Centrowanie bxslider jquery plugin
- 20. jQuery przenieś element DOM wewnątrz rodzica
- 21. Asp MVC Link bezwzględnego działania Action
- 22. Stylizacja tekstu wejściowego CSS
- 23. gradient tekstu css
- 24. CSS wewnątrz tabeli
- 25. WPF - centrowanie zawartości w przewijarce?
- 26. AngularJS: Formularz dostępowy Formularz kontrolny formularza umieszczonego wewnątrz dyrektywy translatującej z nadrzędnego kontrolera
- 27. Przechwytywanie kliknij poza z absolutnego umieszczonego div
- 28. ukryj część tekstu html, css, javascript
- 29. UINavigationItem centrowanie tytułu
- 30. Centrowanie widoków CheckBox
Dlaczego potrzebujemy 'position: absolute;' w .text klasy CSS? Po prostu próbowałem usunąć tę linię, a tekst jest poprawnie wyśrodkowany; – amaurymartiny
ponieważ w blokach będą znajdować się elementy względne i chcę, aby tekst nie wpływał na ich położenie i wyświetlał się tylko na nich. – vlad
Aby umieścić coś na wierzchu, wystarczy pozycjonowanie, niekoniecznie bezwzględnie. – melancia