I have an easy HTML template using bootstrap 3. Template has following structure: static header, static footer and content which is in the bootstrap's class "Container". In the middle of content I have bootstrap'w "Well" and i want it make looks like header and footer. I mean I want it to be the full width of the screen on any screen.
I created easy fiddle.
Here's a question, is there any way to override container's width inside this container?
<header> <div class="container"> <div class="content"> </div> <div class="well"> </div> <div class="content"> </div> </div> <footer>
ORIGINAL + BEST PRACTICE: always move the .well outside of .container to stay idiomatic with Bootstrap
UPDATE + IF ABOVE IS NOT AN OPTION: Given that you cannot easily modify
.container styles and/or move the
.well outside of
The idea is that you want a negative value for
margin-right so that
.well expands across the screen.