fixierte div mit variabler width zentrieren

[DaNoOne]

hi, wie der betreff schon sagt versuche ich eine am unteren rand des browsers fixierte div mit variabler breite zu zentrieren .. hier gehts um den footer, der mittig von weißen content-div liegen soll.

ich steh aufm schlauch :P

SCREENSHOT

margin-left: -100; - geht nicht da variable breite
margin: 0 auto; - will auch nicht

ich hoffe jemand hat eine idee
wenn möglich ohne tabellen oder js

danke schonmal im vorraus :)

#footer {  
  height: 26px;  
  clear: both;  
  color: #000;  
  margin: 0 auto;  
  position: fixed;  
  bottom: 0px;  
}  
  
#footer a:link {  
  text-decoration: none;  
  color: #222;  
}  
  
#footer a:visited {  
  text-decoration: none;  
  color: #222;  
}  
  
#footer a:hover {  
  text-decoration: none;  
  color: #555;  
}  
  
#footer_left {  
  width: 26px;  
  height: 26px;  
  background: url(images/footer_left.png);  
  float: left;  
}  
  
#footer_content {  
  height: 20px;  
  background: url(images/footer_content.png) repeat-x;  
  text-align: center;  
  padding: 3px 0 3px 0;  
  float: left;  
}  
  
#footer_right {  
  width: 26px;  
  height: 26px;  
  background: url(images/footer_right.png);  
  float: left;  
}  
  
#footer a.feed-icon {  
  height: 21px;  
  width: 26px;  
  background: url(images/footer_content.png) repeat-x;  
  padding: 5px 0 0 10px;  
  float: left;  
}

  
<div id="footer">  
  <div id="footer_left"></div>  
  <div id="footer_content"><?php print $footer_message . $footer ?></div>  
  <?php print $feed_icons ?>  
  <div id="footer_right"></div>  
</div> <!-- /#footer -->

[bleicher]

Grüße,
1)und deine frage ist? horizontales zentrieren eines divs ?
üblicherweise setzt man einfach beide seitlichen margins auf auto
2)wenn all die rundungen bitmaps sind, bist du andy.
3) weißt du was besser als screenshto ist? link zur testseite.
MFG
bleicher

[DaNoOne]

1)und deine frage ist? horizontales zentrieren eines divs ?
üblicherweise setzt man einfach beide seitlichen margins auf auto

ja, wenn du etwas genauer hinsiehst, wüsstest du, dass ich margin auto schon versucht hab

2)wenn all die rundungen bitmaps sind, bist du andy.

ja sind es, wer ist bitte andy? :P wenn du meinst dass hätt ich auch anders lösen können, vergisst du dass dort auch noch ein schatten ist ;)

3. weißt du was besser als screenshto ist? link zur testseite.

sollst du haben ;)

http://danoone.de/drupal_dno/

[bleicher]

Grüße,

ja, wenn du etwas genauer hinsiehst, wüsstest du, dass ich margin auto schon versucht hab

siehe unten

2)wenn all die rundungen bitmaps sind, bist du andy.

ja sind es, wer ist bitte andy? :P wenn du meinst dass hätt ich auch anders lösen können, vergisst du dass dort auch noch ein schatten ist ;)

lies mal den von dir verklinkten screenshot, andy ;)

ja, tu hättest es anders olösen können - CSS3 ist schon ausrecihend weit unterstützt, und weil ecken und schatten nicht lebensweichtig sind können alle beide ie6 nutzer auch ohne leben.
alle anderen werden sich über den traffic ärgern und du an dem starren layout verzweiffeln

3. weißt du was besser als screenshto ist? link zur testseite.

sollst du haben ;)
http://danoone.de/drupal_dno/

der footer IST zentriert, was genau ist jetzt das problem? du willst den bezüglich des content-divs zentrieren?
dann würde es vllt helfen den footer in den mainfooter zu packen so haben dein toller "vielbilder" fotoe rund inhaltsbereich keinerlei bezihung.

und meine güte schaffst du dir hämorrhoiden mit all den gerundeten eckenbildern..
MFG
bleicher

[DaNoOne]

der footer ist schon im main (also in dem in dem auch der weiße ist)
und liegt dort linksbündig

die divs im div sind ja nicht das problem ..

sondern dass #footer am boden fixiert ist und sich nicht mehr zentrieren lässt.

ich hab gehofft hier eine evtl hilfreiche antwort zu bekommen ..
aber einfach zu sagen dass ich es mir umständlich mache hilft nicht weiter
ich mach mein design wie es mir gefällt, ich versuch lediglich das problem zu lösen .. wie man es umgehen kann hab ich nicht gefragt ;)

[Cyx23]

Hallo,

ich mach mein design wie es mir gefällt, ich versuch lediglich das problem zu lösen .. wie man es umgehen kann hab ich nicht gefragt ;)

Mit CSS allein lassen sich halt nicht alle Layoutwünsche umsetzen, mitunter ist doch noch ein (HTML-) Container als Lösung nötig.

Ein einfacher Workaround für die Beispielseite könnte aber wohl so ausschauen:

#footer {  
padding-left:13em;  
width:58em;  
}  

Dann verhält sich der Footer zumindest hier unter Firefox passend zum Block mit dem Blindtext. Die witdh-Angabe verhindert den Umbruch bei kleinem viewport, das ginge vmtl. auch anders.

Sonst gibt es z.B. da noch Anregungen zum Zentrieren per CSS.

Grüsse

Cyx23