0
Welcome Guest! Login
0 items Join Now

Divs stacking on top > IE. Flex box problem

    • V-Web's Avatar
    • V-Web
    • Rocketeer
    • Posts: 91
    • Thanks: 0

    Divs stacking on top > IE. Flex box problem

    Posted 8 years 11 months ago
    • We're experiencing problems with the layout in IE (never a dull moment with IE). It seems that the layout divs are stacking on top of eachother instead of next to each other. This is for pretty much all divs on the page; 4 four modules next to each other, sidebar en main next to eachother. Looking at the .scss files this should be designed in the right way with -ms-flex defined in the nucleus engine.

      How can this best be solved?
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: Divs stacking on top > IE. Flex box problem

    Posted 8 years 11 months ago
    • What template?

      Could you please post a URL to your site (this can be done in the secure area tab if you prefer) so we can look for you. Without a link to page where the problem is on your site it is quite hard for us to provide the best solution due to so many variables. We try to provide file names and line numbers for code changes and if changes have already been made then our advice may be incorrect.

      Please do a screenshot of your problem and annotate to make it clear.

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • V-Web's Avatar
    • V-Web
    • Rocketeer
    • Posts: 91
    • Thanks: 0

    Re: Divs stacking on top > IE. Flex box problem

    Posted 8 years 11 months ago
    • This message contains only secure information that is visible to V-Web, moderators and administrators
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: Divs stacking on top > IE. Flex box problem

    Posted 8 years 11 months ago
    • I don't know what a "viper" template is? I guess that's something you created yourself?

      Anyway the problem is cause by the CSS of that template adding a left border to the container (which takes up space) and a left 1rem margin (which takes up space) - negating those statements in IE11 dev tools fixes the issue. The containers are size as 25% 30% and 45% respectively totalling 100% (correct) but border and margins will be added outside of those and therefore that's why the containers wrap (because it's more than 100% width).

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.

Time to create page: 0.065 seconds