Problem with navigation and container/container-fluid



  • Hi

    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?



  • 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

    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.



  • 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...



  • 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.


 

| |