3 divs neben 2 großen anderen

Status
Nicht offen für weitere Antworten.
Danke für die schnelle Antwort ja in der Mitte von Root aber nicht zwischen links und rechts

links ist es, wie es gerade ist. rechts hab ichs mit Photoshop verändert
 

Anhänge

  • ist.jpg
    ist.jpg
    21,8 KB · Aufrufe: 8
  • soll.jpg
    soll.jpg
    21,5 KB · Aufrufe: 8
Wie ich schon letztens schrieb, wird beim Floaten nichts automatisch zentriert.

Hierfür müsstest du das Markup umstellen:
HTML:
<div id="root">
	<div id="m_links">links</div>
	<div id="m_rechts">rechts</div>
	<div id="m_root">
             <div id="m_top" >top</div> 
	    <div id="m_mitte" >mitte</div>
    </div> 
 </div>

und für #m_root diese Regel festlegen:
CSS:
#m_root{
margin:0 20%; /* 20% sind von mir frei gewählt */
background-color:#fff;
}

mfg Maik
 
Danke fürs zusammenführen, dachte weil ich da schon erledigt geklickt habe kann man dort nichts mehr posten.

Damals hat es funktioniert, weil alles mit festen breiten war, leider wirkt es auf großen Bildschirmen sehr komisch.
Deshalb versucht ich gerade es mit % Angaben zu machen, und da kann ich es ja nicht mit einem fixem margin machen, würd sonst ja nicht in der Mitte zentriert sein.
 
vandamp | PN hat gesagt.:
Hallo,

du hast mir ja schon ein paar mal geholfen ;) vielleicht kennst du dich auch mit dem Problem aus .

Ich will, dass rechts und links die divs auf 100% sind, aber auch wenn eine Scrollbar erscheint.

http://vandamp.no-ip.com/freistern/index.php?kat=2

der Beitrag dazu war
http://www.tutorials.de/forum/css/357570-3-divs-neben-2-grossen-anderen.html
Der Hinweis in meiner Signatur ist dir wohl entgangen.
  • Ich biete keinen Support via PN, Skype, ICQ & Co - dafür ist das Forum da!

Wie dem auch sei, AnyColumnLongest listet für dein Vorhaben Techniken auf, damit sich die Spaltenhöhen optisch automatisch angleichen, denn im "Normalfall" ergibt sich die Höhe eines Elements durch seinen Inhalt, ohne Bezug zum Inhaltsumfang im benachbarten Element.

mfg Maik
 
ja habe den Hinweis in deiner Signatur übersehen. ;)

Danke für den Link das Big John - Three Col Equal Height Demo partially liquid schaut doch genau so aus, wie es sein soll.
Leider werd ich daraus nicht ganz schlau.
Das einzige, was er da macht ist 100% 0% bei Hintergrundbildern hinzuzufügen, aber bei mir klappt es nicht hab da extra was umgebaut, damit ich so Hintergrundbilder hab, denen ich das 100% 0% hinzufügen kann.

ich hab jetzt
HTML:
<body bgcolor="#FFF">
<div id="root">
	<div id="m_links">
        <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">
          <tr>
            <td id="spacer_links">&nbsp;</td>
            <td id="links">&nbsp;</td>
          </tr>
          <tr>
            <td id="spacer_links_unten">&nbsp;</td>
            <td id="links_unten">&nbsp;</td>
          </tr>
        </table>
    </div><!--  -->
    <div id="m_rechts">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">
          <tr>
            <td id="rechts">&nbsp;</td>
            <td id="spacer_rechts">&nbsp;</td>
          </tr>
          <tr>
            <td id="rechts_unten">&nbsp;</td>
            <td id="spacer_rechts_unten">&nbsp;</td>
          </tr>
        </table>
    </div>
	<div id="m_root"> <!-- m_root auf  -->
	</div> <!-- m_root zu  -->    
</div>
</body>

und

HTML:
@charset "utf-8";
/* CSS Document */
html, body {
height: 100%; /* WICHTIG STRECKT ANZEIGENBEREICH AUF 100% */
width:100%;
margin:0;
padding:0;
background:#FFF;
}
#root {
width: 100%;
min-width:1016px;
margin:0 auto; /* alles mittig*/
height:100%;
background-color:#FFF;
}
#m_links {
float: left;
width:15%;
height:100%;
}
#spacer_links{
	background-image:url(../img/spacer_links.gif);
	height:715px;
}
#spacer_links_unten{
	background:url(../img/spacer_links_unten.gif) 100% 0% ;
}
#links_unten{
	background:url(../img/links_unten.gif) 100% 0% ;
}
#links{
	background:url(../img/links2.gif) 100% 0% ;
}

#m_rechts {
float: right;
width:15%;
height:100%;

}
#spacer_rechts{
	background-image:url(../img/rechts_spacer2.gif);
	height:715px;
}
#spacer_rechts_unten{
	background:url(../img/rechts_spacer_unten2.gif) 100% 0% ;
}
#rechts_unten{
	background:url(../img/rechts_unten2.gif) 100% 0% ;
}
#rechts{
	background:url(../img/rechts2.gif) 100% 0% ;
}
 
Moin,

ich häng dir mal einen möglichen Lösungsansatz an.

Wenn du darin den Inhalt einer der drei Spalten erweiterst, sodass die Seite gescrollt werden kann, passen sich die benachbarten Spaltenhöhen optisch an.

mfg Maik
 
Zuletzt bearbeitet von einem Moderator:
Moin,

kann man so sehr das Interesse an einem noch offenen Thema verlieren, dass man nicht registriert, dass darin schon vor elf Tagen eine Antwort eingegangen ist :suspekt:

Anhand der (nicht)gezählten Downloads meines Anhangs kann ich an meinen fünf Fingern abzählen, wie oft du hier hereingeschaut haben wirst, obwohl du täglich im Forum anwesend gewesen bist.

Nichts für ungut, aber wundere dich nicht, wenn du dich in der Zukunft in einer Warteschleife wiederfindest.

mfg Maik
 
Zuletzt bearbeitet von einem Moderator:
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück