CODEWITHSUNDEEP
cssformshtml
anonymous2
anonymous2

Reputation: 89

Auto resize div when resizing browser

In my page, I have a form inside a div. When I resize the browser, some parts of the form won't be seen and scroll bars will appear. How can I do it in css wherein after resizing, the whole form will still be visible without having to use scroll bars?

Upvotes: 3

Views: 16512

Answers (2)

bogatyrjov
bogatyrjov

Reputation: 5378

Use "%", not "px", "pt", "em" or whatever constant size, when creating such properties, like width.

For example, #element: width:80%; will make the "element" be 80% in width of it's parent element. And if the parent element is body, it will automaticly change it's width together with the browser window width.

If some child of "element" will have constant width, the minimum width of an "element" will be the same size as this child.

I hope my answer was helpfull.

Upvotes: 6

ArBR
ArBR

Reputation: 4082

Have you tried setting the forms element heihgt and width properties equals to 100% into your CSS file?

<div style="background:gray;width:100%;height:100%">
   <form id="id_form" style="background:orange;width:100%;height:100%">
        <input id="id_send_button" type="button" value="click me..." />        
        <!-- more controls -->
   </form>
</div>

Also consider the positioning property it can be: static, relative, fixed or absolute.

Upvotes: 1

Related Questions