CODEWITHSUNDEEP
htmlcssremoving-whitespace
Al John
Al John

Reputation: 900

White space right from page on small screens only (Safari on desktop and Chrome on mobile phone)

There is a white space on the right side of every page on my website. This white space only appears when the screen width is smaller than 767 pixels so it must be one of the media queries causing it but I can't find the cause. I tried changing widths and overflows on the body element aswell as the #top element, .header element and #menu element. I suspect one of those to cause the problem but I'm puzzled. Strangely this only happens on Safari on my desktop, but on my mobile phone it also happens on Chrome.

See this website on a smaller screen width.

Does anyone have any useful insights?

Upvotes: 0

Views: 806

Answers (3)

Awais
Awais

Reputation: 4902

IT because you didn't follow bootstrap framework...When ever you use row you must use col after that like <div class="row"></div class="col-sm-12">

In above case you use row in header but after that you didnt use col add col div after row OR use 

.header {
    overflow: hidden;
}

Upvotes: 0

Rahul Raju
Rahul Raju

Reputation: 26

enter image description here Please check the image u are using a "row" there remove that. That was there is a horizontal scroll showing

Upvotes: 1

Mehul Davara
Mehul Davara

Reputation: 339

Please add Css

@media (max-width: 767px){
   html {overflow-x: hidden;}
 }

Upvotes: 4

Related Questions