Container fixed and footer fullwidth in Bootstrap 3

Hello, I'm using Bootstrap 3.1.1 and I need to make the row marked in orange fixed and fullwidth, and the rows marked in green fullwidth. How can I do this?

I would also like to use the rows in green as footer. Should I use <footer> tags?

This is the site http://blue-ware.net/ap/

Thanks in advance.
LVL 1
ivanblueAsked:
Who is Participating?
 
Kyle HamiltonConnect With a Mentor Data ScientistCommented:
to position the orange box, apply the following rules to it:

position: fixed;
right: 0;
left: 0;
z-index: 1020;
top: 70px;

Open in new window


then, adjust the padding top of the body tag:
body {
  padding-top: 270px;
  padding-bottom: 30px;
}

Open in new window


You don't have to do anything to the "footer". You can wrap it in a footer tag if you want to be "semantically correct", but it doesn't matter except for maybe certain accessibility cases, screen readers, etc...
0
 
Scott Fell, EE MVEConnect With a Mentor Developer & EE ModeratorCommented:
You can just make both areas a container class but make sure they are either above or below the main content.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.