WordPress.org

Ready to get started?Download WordPress

Forums

The Bootstrap
[resolved] Full width header/hero and footer (8 posts)

  1. anyway
    Member
    Posted 1 year ago #

    How can I realize a full width header/hero and footer, please?

    http://wordpress.org/extend/themes/the-bootstrap/

  2. Hi anyway,

    you could remove the span* classes and add CSS in a Child Theme to make them full width.

    Konstantin

  3. anyway
    Member
    Posted 1 year ago #

    Thank's for the reply. Is it that easy? Are you sure? There are always margins left and right, because the container-class. At the moment I'm trickin' around to close the container over the footer area, following this instructions:

    http://stackoverflow.com/questions/10482850/full-width-hero-unit-in-twitter-bootstrap

    The container inside the theme is starting in the header.php and ending under the footer, so nearby everything is inside the container.

    Do you think this way is too complicated?

  4. Just look at how they created the static sidebar, because that too is 100% CSS. Should work the same way.

  5. anyway
    Member
    Posted 1 year ago #

    I cannot follow you, sorry. Which static sidebar, where? Could you please post a link? All I need is a meaningful example.

  6. I'm sorry, not sidebar, navbar. :)
    Scroll down and you'll find information about it, fixed to top or bottom.

  7. anyway
    Member
    Posted 1 year ago #

    Ah okay, thank you. But the navbar at the Bootstrap page is also outside of container-elements. I'm going to experiment a bit more.

    Thank you for today! :-)

  8. anyway
    Member
    Posted 1 year ago #

    Okay... the only working way is imho, to keep the hero-unit and the footer outside of #page and .container.

    So, I inserted the following after the menus into the header.php of my child theme:

    --
    </div><!-- #page .hfeed .row -->
    </div><!-- .container -->
    // Here comes the hero-unit, or slider or something else
    <div class="container">
    <div id="page" class="hfeed row">
    --

    For the footer, I pushed the closing .container-div in the footer.php up, so that the footer is standing alone.

    I hope that helps somebody else with the same problem. If there is really a CSS-only solution, I'm very interested how to do that.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic