Wątek zablokowany 2015-09-04 09:53 przez dzek69.

[HTML I CSS] Wyśrodkowanie div z użytym position:fixed;

0

Witam.
Tak jak w temacie, jaki jest sposób na wyśrodkowanie div'a z użytym position:fixed; ?

0

Takiego diva oczywiście nie wypośrodkujesz, ponieważ ustalasz na sztywno jego wymiary, ale efekt wizualny jaki chcesz osiągnąć można uzyskać z powodzeniem wykorzystując dwa divy. Jeden div ma ustalone position: fixed, natomiast drugi, który jest w nim musisz wypośrodkować. Nie wiem do końca co chcesz osiągnąć, ale myślę, że to Ci powinno wystarczyć. W podobny sposób można uzyskać efekt pływającego menu bocznego z prawej strony (z lewej nie trzeba do tego zaprzęgać dwóch divów).

0

jeżeli ten div jest wewnątrz jakiegokolwiek bloku to możesz też dać margin left i right, albo też text-align center, zależy co w tym divie chcesz mieć ;] i czy to treść diva ma być wyśrodkowana czy po prostu sam div wobec bloku nadrzędnego

1

Bardzo rzadko tego używam -- wcześniej, bo IE tego nie wspierało, a teraz jakoś nie pojawiła się potrzeba -- ale co za problem?

Jeśli znasz szerokość wyśrodkowywanego elementu, to wystarczy dać mu left równe 50% oraz margin-left równy (-szerokość/2), tj. dla elementu o szerokości 400 px mamy coś takiego:

#wysrodkowywany_element {
  position: fixed;
  left: 50%;
  width: 400px;
  margin-left: -200px; /* połowa szerokości, z minusem z przodu */
}
0
<div style="text-align: center;">
  <div style="position:fixed; bottom:0;">
 <ul>[jakistamkod]
   </div>
</div>

I czemu nie centruje mi danych w drugim div'ie zapisanych jako

  • ? Centruje mi tylko jak sam sobie jakiś tekst wpisze.</p>
1

@updater:
Bo text-align centruje tylko tekst, a nie elementy. Pogooglaj o centrowaniu elementów za pomocą CSS, ew. spróbuj zastosować to co ja Ci napisałem wyżej. Sposobów jest kilka, ale text-align to się robiło... dla IE starszych niż 6, bo szóstka już działała poprawnie w trybie zgodności ze standardami.

Po prostu text-align służy do innego rodzaju centrowania. Centruje elementy wierszowe (np. linijki tekstu), a nie blokowe (takie bardziej samodzielne, prostokątne bloki jak domyślnie div czy ul).

Zalecane, popularne sposoby na centrowanie elementów blokowych to:

  1. position relative, left: 50% i ujemny lewy margines na połowę szerokości centrowanego elementu.
  2. poziome marginesy ustawione na auto.
    Oba sposobu wymagają ustalenia szerokości centrowanego elementu. Istnieje trochę wariacji, szczególnie tego pierwszego, który ja we wcześniejszym poście zaadaptowałem do position: fixed.
0

Dzięki wielkie. wziĄłem się za to i działa, choć to dośc prymitywne, to ważny jest efekt :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0