Mit float bauchst du nur das hier:
PHP-Code:
/* 2-spaltig */
.layout_latest {
float: left;
width: 45%; /* hast du bereits */
}
.layout_latest:nth-child(2n+1) {
background: red;
clear: both;
}
/* 3-spaltig */
.layout_latest {
float: left;
width: 28.3333%;
}
.layout_latest:nth-child(3n+1) {
background: red;
clear: both;
}
Du hast irgendwie zu viel CSS aufgesetzt. Vor Allem das float:right brauchst du nicht.
Wenn du die dann noch zentriert haben möchtest (rechts und links gleicher Abstand), gibt es da einen Trick. Gib den Elementen Margin-Left (und Margin-Bottom). Dann ziehst du die ganze Liste mit dem gleichen Margin-Left, aber negativ, nach links.
PHP-Code:
/* 3-spaltig */
.mod_newsarchive {
margin-left: -5%;
}
.layout_latest {
float: left;
width: 28.3333%;
margin-left: 5%;
margin-bottom: 5%;
}
.layout_latest:nth-child(3n+1) {
background: red;
clear: both;
}
Hier trotzdem noch ein Link zu nem Flexbox-Generator http://the-echoplex.net/flexyboxes/
Lesezeichen