CSS will nicht zentrieren

[webdoktor]

Hallo zusammen

Wer kann mir helfen und zwar habe ich ein Layer mit dem Namen "footer_seitenzahlen_deal_test"
welcher so formatiert ist:

CODE .footer_seitenzahlen_deal_test {

width: 565px;
height: 25px;
text-align: center;
background: #666;


}


Dort habe ich Seitenzahlen drin welche ich so formatiert habe:


QUOTE .numhighlight {

width:15px;
height: auto;
padding: 2px;
text-align: left;
border: 1px solid;
color:#3891bb;
background-color: #d9e2eb;
display: block;
text-align: center;
float:left;


}


Mein Problem ist es nun, dass ich es einfach nicht schaffe, dass die Seitenzahlen zentriert werden in diesem
"footer_seitenzahlen_deal_test" Layer. Ich denke es liegt an dem float:left;

Leider habe ich keine Idee mehr, wie ich das schaffen kann.

Hier das Beispiel:
http://www.younique.ch/test_zentrieren.php

Ich freue mich über jede Antwort und Hilfe von Euch!
Gruss Marco

 

[Japs]

Also bei mir siehts zentriert aus - zumindest im IE8
Wenn du die reinen Zahlen in den Kästchen meinst

Gruß Dirk

 

[Michael Bieri]

CODE margin:auto;

 

[webdoktor]

Hi

Zuerst mal danke für Eure Antworten!

@japs:
Ja ich meine die Zahlen aber sie sollten zentriert sein innerhalb des grauen Kasten.

@alonso:
ich habe bei "footer_seitenzahlen_deal_test" versucht mit "margin:auto" leider ohne
Erfolg.

LG Marco

 

[Michael Bieri]

Hmm, ev. etwas im Cache geblieben oder so?

Hatte es kurz mittels dem CSS-Editor vom Webdev-Plugin direkt an deiner Seite ausprobiert - und hat funktioniert..

 

[webdoktor]

Hi Alonso

Eigentlich habe ich nie probleme mit dem Chace d.h. nach dem F5 ist immer
alles schön aktualisiert.

Wo genau hast Du denn das margin:auto hinzugefügt? Waren die Zahlen
dann schön zentriert im dunkel-grauen balken?

LG Marco

 

[Heiko R]

CODE .footer_seitenzahlen_deal_test {

width: 565px;
height: 25px;
text-align: center;
background: #666;
       margin: 0px auto;


}

Das sollte funktionieren.
Mach mal ein STRG+F5
Mit Strg+F5 lädst du die Seite neu vom Server, mit F5 versucht der Browser zunächst die Seite mit den gecachten Daten wieder zu laden

 

[Michael Bieri]

AH, missverstanden, sorry

hat "nur" den Balken selbst zentriert bei mir Anhang anzeigen 2

 

[Heiko R]

Mist, dann hab ich das auch falsch verstanden :-(

Ähm...
Wenn du weisst, wie viele Boxen in der mitte stehen, dann mit margin-left und margin-right den Außenabstand links und rechts angeben.
Ansonsten würde ich schlicht eine Tabelle in den Haupt-Div legen und da ein td mit align=center reinmachen.
Valides Layout verbietet ja keine Tabellen

 

[webdoktor]

Hallo zusammen

Nochmals herzlichen Dank für eure Bemühungen. Leider weiss ich die genaue Breite nicht,
da diese immer wechselt fals z.B. nur zwei Seiten vorhanden sind ist nur 1-2 wenn aber
mehrere vorhanden sind, dann sind es z.b 1-9 usw.

Hmm, das mit den Tabellen habe ich mir auch schon überlegt. ich werde wohl mal als
temporäre lösung das mit der Tabelle machen. Vielleicht weiss ja plötzlich noch jemand
anderes eine Lösung...

Habe auch noch mit

CODE clear: left


rumgespielt aber leider bis jetzt auch noch ohne Erfolg!

LG Marco

 

[webdoktor]

Hmm

ich wollte das mit der Tabelle machen aber nicht mal das geht d.h.
auch dort wird es komischerweise nicht zentriert :-(

http://www.younique.ch/test_zentrieren2.php

Gruss Marco

 

[Sascha Ahlers]

Bereinige doch bitte erstmal den HTML-Quelltext. CSS reagiert auf sowas sehr allergisch

http://validator.w3.org/check?uri=http%3A%...=Inline&group=0

QUOTE Validation Output: 1 Error
Line 16, Column 83: character "<" is the first character of a delimiter but occurred as data
…n><span class="numhighlight_fertig"><</span> <span class="numhighlight">1</sp✉
This message may appear in several cases:

You tried to include the "<" character in your page: you should escape it as "<"
You used an unescaped ampersand "&": this may be valid in some contexts, but it is recommended to use "&", which is always safe.
Another possibility is that you forgot to close quotes in a previous tag.

Line 16, Column > 80: XML Parsing Error: StartTag: invalid element name
…span><span class="numhighlight_fertig"><</span> <span class="numhighlight">1<…


Danach wird wohl noch ein Fehler geworfen werden, weil ich ich noch mindestens einen weiteren Fehler gesehen hat, den der Validator erst nah Bereinigung des Ersten finden kann.



Dann vielleicht mal drüber nachdenken die Links als Liste (in HTML) zu schrieben. Gründe hierfür sind hauptsächlich die Barriefreiheit und sauber strukturierter HTML-Quellcode. Zudem habe ich es nur so als Beispiel. Eine Abtrennung usw., wie bei Deiner Liste, ist mit etwas CSS-Spielerei da auch noch drinne.


Beispiel:

CODE <ul class="quick_nav">
<li><a href="./bohrer.html" title="vorherige Abbildung"><<</a></li>
<li><a href="../abbildungen.html" title="Abbildungsindex">Index</a></li>
<li><a href="./klinge-2.html" title="nächste Abbildung">>></a></li>
</ul>


CODE ul.quick_nav {
line-height: normal;
margin: auto;
margin-bottom: 1em;
margin-top: 1em;
padding: 0;
text-align: center;
}

ul.quick_nav li {
display: inline;
list-style: none;
margin: .5em;
padding: 0;
text-align: center;
}

 

[webdoktor]

Hallo zusammen
Hallo Sascha

Vielen Dank für Eure Bemühungen. Ich habs jetzt geschafft und zwar mit

CODE display:inline-block;


Vielen Dank an alle!
LG Marco