CSS DIV Layer untereinander zentrieren und Größe automatisch an Inhalt anpassen

F

Fpunkt

Grünschnabel
Hallo Leute,

ich hab jetzt schon ne Weile geschaut aber keine Lösung gefunden.

Ich würde gern wie auf Folgendem Img zu sehen den Inhalt meiner Website Text für Text untereinader und zentriert darstellen und jeden Text mit einem Hintergrund hinterlegen, der sich der Größe des Textes anpassen soll.

Mit Tabellen ist das kein Problem. Da ich aber ungern auf Tabellen zurückgreifen möchte, weil ja immer wieder so viel negatives über sie geäußert wird, würde ich es gern mit div layern machen.

Allerdings bezweifel ich langsam, dass es überhaupt möglich ist..

Vielleicht hat hier ja noch jemand ene Idee.

Dank schön!

problem_div.jpg
 
In etwa so?

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title></title>
  <style>
   body{text-align:center;}
   #d1{width:100px;background-image:url("http://www.tutorials.de/customavatars/avatar34130_2.gif")}
   #d2{width:75px; background-image:url("http://www.tutorials.de/customavatars/avatar11057_2.gif")}
   #d3{width:175px; background-image:url("http://style.tutorials.de/v10/loginbox/settings.png")}
   #d4{width:120px;background-image:url("http://style.tutorials.de/v10/headerlogo.png")}
   div {border:4px solid #333}
   img{height:100%}
  </style>
  </head>
  <body>
    <div id="d1">bla1 bla1 bla1 bla1 bla1 bla1bla1 bla1 bla1 bla1 bla1 bla1</div>
    <div id="d2">bla2 bla2 bla2 bla2 bla2 bla2bla2 bla2 bla2 bla2 bla2 bla2</div>
    <div id="d3">bla2 bla2 bla2 bla2 bla2 bla2bla2 bla2 bla2 bla2 bla2 bla2</div>
    <div id="d4">bla4 bla4 bla4 bla4 bla4 bla4bla4 bla4 bla4 bla4 bla4 bla4</div>
  </body>
</html>
 
Zuletzt bearbeitet von einem Moderator:
Hi Fpunkt,

ich befürchte, dass normalerweise die Breite explizit angegeben werden muss, währe aber mit JavaScript vielleicht sogar möglich.
Was hälts du von einem <center> ... </center> um alle divs, gilt zwar als veraltet, funktioniert aber in alle Browser und hat mir schon manchmal richtig geholfen.

Gruß
 
In etwa so?
Zum Vergrößern anklicken....
Ja so, nur mit einer Div Breite, die sich automatisch dem text anpasst.
ich befürchte, dass normalerweise die Breite explizit angegeben werden muss, währe aber mit JavaScript vielleicht sogar möglich.
Zum Vergrößern anklicken....
ja.. ist wohl nur mit tabellen möglich :( und java möchte ich dafür nicht, dann nehm ich lieber tabellen.

Was hälts du von einem <center> ... </center> um alle divs, gilt zwar als veraltet, funktioniert aber in alle Browser und hat mir schon manchmal richtig geholfen.
Zum Vergrößern anklicken....
Das wäre dann ja in etwa das, was Netzwerkidi mit
body{text-align:center;}
Zum Vergrößern anklicken....
vorschlägt.

Danke trotzdem für eure Tipps!
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück