• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[ERLEDIGT] Divs sollen andocken und nicht umbrechen

J

jorgos

Neues Mitglied
Hallo zusammen,

nach langer Suche, habe ich leide rnichts gefunden und benötige eure Hilfe.
Ich habe drei Divs nebeneinander und die dürfen nicht umbrechen, wenn ich den Browser verkleinere.
Dann soll nach Möglichkeit auch kein horizontzaler Scrollbalken entstehen.
Wenn ich den Browser zusammenschiebe, springt die rechte Seite unter den Content
Ich hoffe, mit kann jemand helfen. Ist leider echt dringend :)


Eigentlich wunderschön zu sehen, wie das hier im Forum realisiert wurde.
Links die Infobox mit dem Namen, dann der Content und rechts die "Aktuellen Diskusionen".
Genauso möchte ich das haben.

Vielen Dank im Voraus

Jorgos

HTML: 
<style>
*{
    margin:0;
}
 
#content {
        position: relative;
        float:left;
        background: #ff0;
}
 
#leftside {
        float:left;
    position: relative;
    height: 100%;
        width:40%;
    background: #ab3023;
        max-width:280px; /* das muss so bleiben. Vorgabe des Kunden */
}
 
#rightside {
    position: relative;
    height: 100%;
        width:20%;
    background: #ff0;
    float: right;
        max-width:280px;
        min-width:280px;
}
 
 
</style>
<body>
<div id="leftside">Linke Seite</div>
 
<div id="content">Content -------------------------------------------------------</div>
<div id="rightside">Rechte Seite</div>
 
</body>
 
Werbung:
Werbung:
Hallo,

bei folgendem Code fliegt das rechte Div beim zusammenschieben unter den Content-Container.
HTML: 
<style>
*{
    margin:0;
}

#wrapper{
      min-width:500px;
}

#content {
        position: absolute;
        left:280px;
        background: #ff0;
}

#leftside {
        position: relative;
        float:left;
    height: 100%;
        width:40%;
    background: #ab3023;
        max-width:280px; /* das muss so bleiben. Vorgabe des Kunden */
        min-width:280px;

}

#rightside {
    position: relative;
    height: 100%;
        width:20%;
    background: #ff0;
    float: right;
        max-width:280px;
        min-width:280px;

}


</style>
<body>
<div id="wrapper">
<div id="leftside">Linke Seite</div>
<div id="content">Content -------------------------------------------------------</div>
<div id="rightside">Rechte Seite</div>
</div>

</body>
 
Werbung:
sorry, aber das ändert nichts. soweit war ich auch schon.
Aber vielleicht habe ich was übersehen.
Hier mal der aktuelle Code

HTML: 
<style>
* {
    margin: 0;
}

#wrapper {
    min-width: 500px;
}

#content {
    left: 280px;
    background: #999999;
    width: 60%;
    float: left;
}

#leftside {
    float: left;
    height: 100%;
    width: 40%;
    background: #ab3023;
    max-width: 280px; /* das muss so bleiben. Vorgabe des Kunden */
    min-width: 280px;
}

#rightside {
    height: 100%;
    width: 20%;
    background: #ff0;
    float: right;
    max-width: 280px;
    min-width: 280px;
}
</style>
<body>
<div id="wrapper">
<div id="leftside">Linke Seite</div>
<div id="content">Content -------------------------------------------------------</div>
<div id="rightside">Rechte Seite</div>
</div>

</body>
 
Ich sehe da immer noch ein float: right, und außerdem sollte die min-width des Wrappers groß genug sein, damit die darin liegenden Element auch genügend Platz haben.

Das sind aber nun wirklich einfachste Basics, die man man wissen muss, wenn man schon einen Kundenauftrag annimmt. Weder können wir dir hier im Forum CSS beibringen, noch schreiben wir mit dir zeilenweise die CSS Datei.
 
Hallo,

1. Kunde ist vielleicht übertrieben. Ist ein befreundeter Verein.
2. Die Linke Seite sollte eine fixe Breite haben.
3. die Rechte Spalte sollte rechts angedockt sein.


Über Tips wäre ich dankbar.
Keiner soll mir hier meinen code schreiben.
 
Werbung:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben