Full Width (100%) Section On A Fixed Width Page

There have been a number of website development projects that have required a full width section in the middle of a single fixed width page. Rather than use a widget for just one page, this is an alternative option. The best part is, it’s very simple!

The code

<div class="row-full">

</div>

CSS

.row-full 
{
width: 100vw;
position: relative;
margin-left: -50vw;
height: 100px;
padding: 50px 0;
left: 50%;
clear: both;
}

Now that was easy!

Give it a try or give us a call if you need a custom website designed or developed.