Solved

How to make <div> auto resize with the browser window?

Posted on 2004-03-21
5
618 Views
Last Modified: 2007-12-19
In Windows application, we can use Anchor property to "link" Windows control to the edge of the windows form. When user resizes the Windows form, the control resizes together with the Widnows form.

Can I do the same thing in ASP.NET with <div>? Which means, if user resizes the Browser window, I want this <div> resizes with it. If <div> is not big enough to hold all the web content inside it, I want scroll bars automatically added for this <div>. Are there any way to do this?

Thanks a lot.
0
Comment
Question by:BruceCheng
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
5 Comments
 
LVL 12

Accepted Solution

by:
esteban_felipe earned 84 total points
ID: 10646939
Hi BruceCheng,

Not really... <div> tags are supposed to use all available width of the container tag (all window width if it's inside <body> or all the cell width if it is inside <td>) unless you specify a width in the style property. The height will be set by the content. It will take all the height necessary to render it's content.

If you want scrollbars, then you should move to an IFrame tag.

This is not really related to ASP.NET but rather with HTML code (ASP.Net is the framework that allow you to do object oriented server programming to emit html/javascript code that simulate events). HTML by itself is very limited for appereance.. this is why webmaster/graphics designers usually make good money :)

Esteban Felipe
www.estebanf.com
0
 

Assisted Solution

by:Dekkert
Dekkert earned 83 total points
ID: 10647283
Regarding the scrollbar issue:
Have a look at the overflow property of css. That should do the trick.

Regarding the "resize" issue:
There are a lot of javascripts out there that "measure" the size of the window it's in. Given that, it's possible to dynamically resize the div. Like Esteban said, this has nothing to do with programming, more with HTML/CSS/Javascript.

Good luck!
0
 
LVL 4

Assisted Solution

by:locitt
locitt earned 83 total points
ID: 10654074
try this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language=javascript>

window.onload = setAutosize;

function setAutosize()
{
      document.all("theDIV").style.setExpression("width", "document.body.clientWidth");
      document.all("theDIV").style.setExpression("height", "document.body.clientHeight");
}

</script>
</HEAD>

<BODY leftmargin=0 topmargin=0>
<div id=theDIV style="position: absolute; left: 0px, top: 0px; background-color: black; overflow: auto">
</div>
</BODY>
</HTML>


locitt.
0

Featured Post

Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Welcome my friends to the second instalment and follow-up to our Minify and Concatenate Your Scripts and Stylesheets (http://www.experts-exchange.com/Programming/Languages/.NET/ASP.NET/A_4334-Minify-and-Concatenate-Your-Scripts-and-Stylesheets.html)…
Many of us here at EE write code. Many of us write exceptional code; just as many of us write exception-prone code. As we all should know, exceptions are a mechanism for handling errors which are typically out of our control. From database errors, t…
How to Install VMware Tools in Red Hat Enterprise Linux 6.4 (RHEL 6.4) Step-by-Step Tutorial

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question