Page 1 of 1

Problem with width od body

Posted: Sun Feb 18, 2018 8:57 am
by Tata
I have made three templates to a webpage (dubina, dubina_op and dubina_op2). The firs of them works fine. The others work also fine except of the width of the body. There is a white space on the right, so the scrollbar-x is there and the whole page is movable to the left showing the white space.
I can't find the selector making this space. How to find it? I can add overflow-x: hidden; in body selector. But this seems not to be the clear solution.
URL is http://rancdubina.cmsimple.sk

Re: Problem with width od body

Posted: Sun Feb 18, 2018 11:42 am
by cmb
Tata wrote:
Sun Feb 18, 2018 8:57 am
I have made three templates to a webpage (dubina, dubina_op and dubina_op2). The firs of them works fine. The others work also fine except of the width of the body. There is a white space on the right, so the scrollbar-x is there and the whole page is movable to the left showing the white space.
Wrt. dubina_op I see two issues. Firstly, the <body> defines a width of 100vw which makes it some pixels wider than the html (don't know why). Secondly, .wrapper1.slider defines a width of 100%. Removing both widths makes the horizontal scrollbar disappear for me.

Re: Problem with width od body

Posted: Sun Feb 18, 2018 11:57 am
by Tata
Danke, es geht. Es ging auch mit html{overflow-x: hidden;}. So ist es jedenfalls besser.

Re: Problem with width od body

Posted: Sun Feb 18, 2018 11:59 am
by lck
cmb wrote:
Sun Feb 18, 2018 11:42 am
Wrt. dubina_op I see two issues. Firstly, the <body> defines a width of 100vw which makes it some pixels wider than the html (don't know why).
Yes, body should have width: 100%;
100vw = Viewport-width with scrollbar
100% = Viewport-width without scrollbar
cmb wrote:
Sun Feb 18, 2018 11:42 am
Secondly, .wrapper1.slider defines a width of 100%. Removing both widths makes the horizontal scrollbar disappear for me.
The second problem is the class .footer. There is a padding of 1em without box-sizing: border-box;

Re: Problem with width od body

Posted: Sun Feb 18, 2018 1:02 pm
by cmb
lck wrote:
Sun Feb 18, 2018 11:59 am
100vw = Viewport-width with scrollbar
100% = Viewport-width without scrollbar
Ah! Thanks!