CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
user2403131
user2403131

Reputation: 43

html5 - How i can disable horizontal scroll in responsive layout

My layout is responsive, but if I change the size of the page it gets all messy. I wonder how do I put a min-width on my body. so that the page can be resize to eg 500px wide.

PS:

I try set

body {
    min-width:400px;
}

but no work

I use bootstrap

The problem is when I go to change the size of my window (page). when I leave the width very small components are misaligned.

Upvotes: 0

Views: 899

Answers (3)

Josh
Josh

Reputation: 1049

Either your can give parent div for the layout with fixed width, then scroll bars comes if reduces the browser size, There won't be any mess.

it won't be no use controlling body width

another way give percentage value for the width size to maintain the layout structure

Upvotes: 0

Russell Zahniser
Russell Zahniser

Reputation: 16364

You can't really control the width of the <body> element, since it must fill the browser window. Try wrapping your content in a <div> with a min width.

Upvotes: 0

Tomer
Tomer

Reputation: 17930

You need to inspect the element with chrome/FF dev tools and make sure that bootsrap styling is not overriding your style. You can also try this: 

 body {
    min-width:400px !important;
}

if that works, it means bootsrap is overriding the style.

Upvotes: 1

Related Questions