Problem with navigation and container/container-fluid

Moved Technical Support
  • #1


    I made my own theme as a fork of Lavender. To be able to have different "container" content classes on different pages, I moved the two following lines from the end of header.tpl to home.tpl, category.tpl and topic.tpl.

    <div class="container" id="content">
    <!-- IMPORT partials/noscript/warning.tpl -->

    Now, in home.tpl only I replaced container by container-fluid.
    My problem is that When I'm in browsing from a topic or a category to home (hitting the Home item in the breadcrumb), the layout doesn't change, and I see the home page with container instead of container-fluid.

    What should I do? Would separating the #content.container div into 2 levels of divs (#contentcontaining container) work?

  • #2

    Eh, my idea was correct I think. It seems that the browsing replace the content of #content with the other page #content, so splitting that into 2 divs works. Can anyone confirm this is how it works?

  • Global Moderator Plugin & Theme Dev

    I know it does replace #content with the new page. So, you'd be better writing some JavaScript to change the class based on the template name.

  • #4

    Well, a client side Javascript would make the page change after it loaded, I don't want that.

    The problems I found with my currently implemented solution are that I've got an horizontal scrollbar (I should be able to fix that with some CSS somehow) and it seem to add another #content div when browsing... Which is wrong...

  • #5

    In the end, here are the only changes (to the original theme) I did to successfully achieve what I wanted without bug:

    1. Change container to container-fluid in header.tpl to set the "default" format to fluid.
    2. For each page that I want to be non-fluid, wrap the whole ***.tpl into a <div class="container"></div>.
      For example I did this for category.tpl, topic.tpl, register.tpl and login.tpl.

    It works.

Suggested Topics

| | | |