Header

CSS Template using Float

In this example, we have created a header, three equal columns and a footer. On smaller screens, the columns will stack on top of each other. Resize the browser window to see the responsive effect.

Column 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras nisi libero, facilisis eget velit vitae, rhoncus interdum felis. Donec faucibus mauris metus, vitae aliquet justo dictum facilisis.

Column 2

Vivamus mattis elit ac ornare finibus. Vestibulum cursus nunc nec massa elementum vulputate ut sit amet tortor. Aliquam dictum purus non metus elementum finibus. Donec fringilla convallis elit et aliquam.

Column 3

Donec eleifend purus ut sapien fermentum dignissim. Morbi placerat varius erat. Etiam ut placerat nisi, id tempus sapien. Suspendisse potenti. Mauris dictum tincidunt dui et tristique. Pellentesque porttitor odio vitae ante sodales semper.