CODEWITHSUNDEEP
htmlcss
user1076755
user1076755

Reputation: 33

How do you keep elements the same position when the page is resized?

I have multiple divs with text and what not in them. When the page is made smaller horizontally all of the elements shift. However,if you resize this page, elements disappear and nothing moves. How do I fix this problem so it is like this page?

Thanks!

Upvotes: 3

Views: 4666

Answers (3)

MCSI
MCSI

Reputation: 2894

Predefined sizes make the elements do not move when you resize the screen, that will keep their size in different screen resolutions also, that is to take into account. Also you must use margins and padding fixed.

In short ... not more percentages, but don't abuse fixing everything

Upvotes: 0

Ryan
Ryan

Reputation: 2503

If you want to center all you content, wrap it in a div like so:

<div class="wrapper">
    <!-- Your Content !-->
</div>

And then add the following to your stylesheet:

.wrapper {margin:0 auto;width:960px;} /* Change 960 to desired width */

I hope this helps!

Upvotes: 1

Greg Franko
Greg Franko

Reputation: 1770

If you view the source of this Stackoverflow page, then you will notice that all of the content on the page is wrapped inside of a container div with the width set to 100%, and the margin and padding both set to 0. If you want to have a fixed width, then do not use percentages, but instead specify your page to be a specific width in pixels.

Upvotes: 1

Related Questions