Streaming live at 10am (PST)

Responsive div layout


i want to make a layout like the daily section on esquire

first i wanted to use a container with several rows - but i think its not possible that two rows from different containers are overlapping? as you can see on esquire - the 1st image is higher then the second one but just below the 3nd article the 3rd one starts.

so i think divs are the right way? but i dont know how to handle the floating? the first “row” is no problem with float:left, but when i’m using float:left in the row beneath as well it doesn’t work.

sorry i’ve just got very basic css skills :confused:

Try to NEST rows. As the image shows, start with one 2 columns row widget (orange), then add two more 2 cols row widgets (green) in the 2nd col of the first one.

Then inside each col you build your element with divs.

ahhhh thank you! i think this should work :slight_smile: