CODEWITHSUNDEEP
csstwitter-bootstrap
RogueWolf
RogueWolf

Reputation: 135

My Elements Are Overlapping When Window Size Reduces

I've got these boxes that pop up that's fine its when the screen size reduces they start overlapping each other. I would like to keep constant spacing between the boxes and stop text from running out the box is this possible?Normal Screen Size,Smaller Screen Size,Even Smaller Screen Size

Upvotes: 0

Views: 3547

Answers (1)

Nitesh
Nitesh

Reputation: 15749

You have to use the min-width CSS Property to prevent overlapping.

For Instance,

#abc, .abc{
    min-width:800px;
    }

The min-width property allow authors to constrain content widths to a certain range.

SOURCE

What the above example does is that if your window for instance reaches a minimum width of 800px, it gives you a horizontal scrollbar at the bottom which fits your content to a minimum range of 800px.

Hope this helps.

PS: #abc, .abc is a dummy name for the div id or class that you have for which you need to set the min-width to prevent overlap. You can replace this with your id or class. Similarly 800px is an illustrative value which you can replace with your desired window width.

Upvotes: 1

Related Questions