Forum PHP.pl

Jak wyśrodkować div, żeby było to poprawnie zrobione i w każdej przeglądarce działało?

Kiedyś robiłem to prymitywnymi sposobami i w niektórych przeglądarkach się sypało.

Mam:

[HTML] pobierz, plaintext 
<div class="strona">
 
jakaś tam treść...
 
<div class="przycisk">Przycisk</div>
 
</div>
[HTML] pobierz, plaintext 

I chciałbym właśnie mój przycisk wyśrodkować, jak to zrobić?

w ogólności powinno zadziałać dodanie do pliku css:

[CSS] pobierz, plaintext 
.przycisk {
  margin 0 auto;
}
[CSS] pobierz, plaintext 

W poziomie:


Przejrzyj moje ostatnie tematy, też pytałem o coś podobnego i dostałem kilka odpowiedzi na poziome i pionowe wyśrodkowanie.

Tylko 2 przyciski na wszystkich podstronach będą wyśrodkowywane, więc nie dopisuje tego do pliku CSS, robię to w ten sposób:

[HTML] pobierz, plaintext 
<div class="przycisk" style="margin: 0 auto;">Przycisk</div>
[HTML] pobierz, plaintext 

Niestety nie działa.

Oczywiście chodzi mi o wyśrodkowanie w poziomie.

Ten post edytował xlinksysx 4.10.2012, 17:45:17

Dodaj jeszcze jakiś width do tego przycisku (IMG:style_emoticons/default/wink.gif) To że będą tylko dwa nie oznacza, że nie powinieneś dopisać tego do zewnetrznego arkuszu css (IMG:style_emoticons/default/smile.gif)

Taka uwaga na boku: mimo wszystko unikaj inline css - jest to mimo wszystko coś, co zapobiega rozdzieleniu treści (plik html) od formy (plik css). Lepiej sobie stwórz nową klasę na wyśrodkowane przyciski, np. ".przycisk_centr" i styluj w CSS.
A wracając do problemu: możesz zaprezentować kawałek kodu html?

A jeżeli width nie jest stały, bo zależy od długości tekstu na przycisku, to co wtedy?


Edit:

Podałem kod z głowy, przykładowy. Oto jak mam naprawdę:

[HTML] pobierz, plaintext 
<div id="description">
  <div class="eight columns">
    <div class="description bottom">
      <h1>Rejestracja</h1>
      <h2>Nie posiadasz jeszcze konta? Utwórz konto zupełnie za darmo!</h2><br/>
      <div class="four columns alpha"><a href="index.php?a=newacc" class="link">Załóż nowe konto</a></div>
    </div>
  </div>
</div>
[HTML] pobierz, plaintext 

Czyli jak wyśrodkować four columns alpha względem description bottom?

Ten post edytował xlinksysx 4.10.2012, 17:54:34