Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Div position absolute i margin auto
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
straku
Witam wszystkich!
Nie mam pomysłu jak zrobić głównego diva z divem w środku tak aby ten główny był wyśrodkowany oraz dostosowywał się do szerokości automatycznie.
Obecnie mam taki kod i wszystko gra oprócz wyrównania do prawej i lewej w równych odstępach.
  1. <div id="dol">
  2. <div class="linki">
  3. <h1>nazwa_zakladki</h1>
  4. </div>
  5. </div>

  1. #dol{
  2. width: 1000px;
  3. height: 100px;
  4. background-color: PaleGoldenrod;
  5. }
  6. #dol .linki{
  7. position: absolute;
  8. height: 20px;
  9. margin-left: 0%;
  10. margin-right: 0%;
  11. background-color: lightblue;
  12. }
  13. #dol .linki h1{
  14. height: 15px;
  15. float: left;
  16. padding: 2px;
  17. margin: 0 10px 0 10px;
  18. font-size: 12px;
  19. font-weight: normal;
  20. background-color: lightgreen;
  21. }

W tej chwili div "#dol .linki" usytuowany po lewej stronie głównego diva "#dol"
Jakiś pomysł?
Dużo przykładów jest na forum ale z podana szerokościa a'la #div. linki ale tu niestety jest inna sytuacja.
!*!
http://jsfiddle.net/T6kut/
straku
Hmm źle napisałem chodzi mi o coś takiego:
  1. <div id="dol">
  2. <div class="linki">
  3. <h1>zakladka 1</h1>
  4. <h1>zakladka 2</h1>
  5. <h1>zakladka 3</h1>
  6. <h1>zakladka 4</h1>
  7. <h1>zakladka 5</h1>
  8. </div>
  9. </div>


#dol to jest kontener, w którym będzie kilka divów(div class).
#dol .linki ma się dostosowywać szerokością do ilości zakładek ze znacznikiem <h1>.

Jakbym zrobił jeszcze jednego diva, który byłby ponad #dol .linki i dał mu szerokość auto, to jak myślisz !*! zadziałałoby to?
!*!
http://jsfiddle.net/T6kut/1/show/ jesli nie o to Ci chodzi, to pokaż jakiś obraz / kod online. Ewentualnie jak chcesz wycentrować div link, to użyj display:table na rodzicu.
straku
http://jsfiddle.net/T6kut/3/ efekt jak pod linkiem.

Zależy mi aby czerwony div dostosowywał się do zwiększającej liczby zakładek przy czym jego wyrównanie do obydwu marginesów było takie same. Przy 6 zakładkach margines lewy ustawiłem na 10% i uzyskałem efekt taki jak chciałem. Wiadomo będzie to niewygodne z tego względu, że jak dodam kolejna zakładkę będę musiał zmieniać margin-left z 10% na mniejszy.
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.