Hallo,
ich habe ein Problem bei der Responsive Anpassung eines 3 Spalten Layouts:
Bei einer verkleinerten Fensteransicht soll die linke Spalte (#left) unter die Hauptspalte (#main) rutschen und die rechte Spalte soll weiterhin nach rechts floaten. Und nun zu meinem Problem: Die rechte Spalte orientiert sich leider an der linken Spalte und wird erst auf der Höhe der linken Spalte gefloatet und nicht auf der Höhe der Hauptpalte (#main). Dieses Verhalten leuchtet mir auch ein, aber ich habe keine Idee wie ich das beeinflussen kann. Hier eine Beispielskizze: beispiel_spalten.jpg
Mein CSS Code:
@media (max-width: 768px) {
#main,
#left,
#right {
float: none;
position: relative;
margin-right:0;
margin-left:0;
left:0;
right:0;
box-sizing: border-box;
}
#main,
#left {
width: 70%;
float: left;
}
#right {
float:right;
width: 30%;
}
}
Hat jemand eine Idee wie ich das Problem lösen könnte?
Lesezeichen