daywandler: Darstellungsproblem mit mehreren DIV's nebeneinander

Guten Morgen,

ich versuche schon seit gestern 3 DIV's nebeneinander zu platzieren, das ist mir auch soweit gelungen. Aber leider gibt es bei anderen Auflösungen Probleme bei der Darstellung und nun wollte ich Fragen wie man dies ändern kann.

Ich habe folgenden HTML-Code für meine Überschrift:

  
<div class="main">  
<div class="main_title_left"></div>  
  <div class="main_title"> Überschrift </div>  
  <div class="main_title_right"></div>  
  </div>  

Und folgenden CSS-Code:

  
.main {  
  
 margin-left:  100px;  
 margin-right:  100px;  
}  
  
.main_title_left {  
        float:                  left;  
 background-image: url(../img/border-top-left.png);  
 width:    10px;  
 height:    64px;  
 width:                  5%;  
}  
.main_title_right {  
 float:                  right;  
 background-image: url(../img/border-top-right.png);  
 width:    10px;  
 height:    64px;  
 width:                  5%;  
}  
.main_title {  
        float:                  left;  
 background-image: url(../img/border-top-center.png);  
 background-repeat: repeat-x;  
 font-size:   24px;  
 font-weight:  bold;  
 height:    45px;  
 padding-top:  25px;  
 width:89%;  
}  

Sozusagen sind es 3 Spalten wo Links und Rechts jeweils ein Bild von 60px breite und 64px höhe ist und der mittlere Teil soll 100% werden.

Ich habe schon mehreres versucht, aber z-index funktioniert auch irgendwie nicht.

Ich hoffe mir kann jemand helfen. Danke schonmal.

  1. Sozusagen sind es 3 Spalten wo Links und Rechts jeweils ein Bild von 60px breite und 64px höhe ist und der mittlere Teil soll 100% werden.

    Ich habe schon mehreres versucht, aber z-index funktioniert auch irgendwie nicht.

    z-index hat auch nix mit der breite oder höhe zu tun

    Ich hoffe mir kann jemand helfen. Danke schonmal.

    du kannst dir selbst helfen, indem du in erster linie beschreibst, was du ausdrücken willst

    beschreiben im sinne von vernünftiges markup verwenden und
    beschreiben im sinne von jeder soll meine fehlerbeschreibung verstehen können und auch wissen, was das ganze eigentlich bezwecken soll

    deine ausführungen sind jedenfalls etwas unloglisch - deinen mittleren teil hast du mit 89% breite angegeben, er soll aber 100% bereit sein - hä?

    wie bereits erwähnt: beschreibe WAS du willst, nicht wie "etwas" nicht funktioniert wovon keiner weiss, was es eigentlich sein soll

    1. ok, dann sorry, wenn ich mich unverständlich ausgedrückt habe.

      ich versuche es mittels einer grafik etwas verständliches zu machen.

      --------------------------------------------------
      |                   div.main                     |
      |----------------------------------------------| |
      |                |           |                 | |
      | div.title_left | div.title | div.title_right | |
      |                |           |                 | |
      -----------------------------------------------|-|

      Hier habe ich meine 3 Spalten die alle innerhalb von div.main sind.

      Ich möchte title_left, title und title_right nebeneinander.
      In title_left und in title_right ist eine Grafik die 64px hoch und 60px breit ist. div.title soll 100% breit sein und alles soll auf einer Zeile bleiben.

      deine ausführungen sind jedenfalls etwas unloglisch - deinen mittleren teil hast du mit 89% breite angegeben, er soll aber 100% bereit sein - hä?

      Wenn ich div.title 100% breit mache, dann gibt es ein Zeilenumbruch.

      z-index hat auch nix mit der breite oder höhe zu tun

      mit z-index wollte ich erreichen, wenn div.title 100% breit ist, die grafiken von div.title_left und title_right ÜBER div.title zu legen und so dem zeilenumbruch entgegen zu wirken.

      Ich hoffe nun ist es etwas verständlicher

      1. Ich hoffe nun ist es etwas verständlicher

        was du visuell erreichen willst, hab ich schon verstanden - ich habe aber bisher immer noch nicht verstanden, WAS das ganze sein soll - eine überschrift, eine tabelle, ein dekoratives element?