Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Junior Member manuleka's Avatar
    Join Date
    Apr 2005
    Posts
    4
    Member #
    9745
    just wondering if anyone can tell me how to make the div size (height in my case) be dependent on the size and amount of children divs it has....

    for the case of my codes below, the div id="menumain" overlaps over the borders of it's parent div id="contents"

    check the result on http://www.nutstuff.net

    css:
    Code:
    <html>
    	<head>
    		<meta http-equiv="page-enter" content="progid:dximagetransform.microsoft.pixelate(duration=3)" />
    		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    		<meta name="author" content="nutstuff.net" />
    		<meta name="keywords" content="web design, web development, simple it solutions" />
    		<meta name="description" content="simple web and it solutions" />
    		<title>NutStuff - Home</title>
    		<style type="text/css">
    			div{
    				position:absolute;
    				}
    			div#mainlogo{
    				/* MAIN LOGO */
    				top:0;
    				left:50%;
    				margin-left:-370px;
    				width:740px;
    				height:100px;
    				background-image:url('imgs/nutstuff.gif');
    				}
    			div#contents{
    				top:110px;
    				left:50%;
    				margin-left:-370px;
    				padding:10px;
    				width:719px;
    				height:auto;
    				border:1px solid #c0c0c0;
    				border-top:25px solid #c0c0c0;
    				color:#000;
    				font-family:tahoma;
    				font-size:11px;
    				font-weight:bold;
    				}
    			div#contents div#menumain{
    				position:absolute;
    				top:0px;
    				left:540px;
    				width:180px;
    				height:250px;
    				margin-top:10px;
    				border:1px solid #c0c0c0;
    				background-color:#e0e0e0;
    		</style>
    html:
    Code:
    		<div id="mainlogo">
    			<img src="imgs/ad1.gif" alt="your closest to free web start!" />
    		</div>
    		<div id="contents">
    				Welcome to nutstuff.net, our site is under construction!<br />
    				Please visit again sometime soon<br /><br />
    				Nut Stuff crew<br /><br />
    				<?php
    					print "<span style=\"font-weight:normal;\">\n\t\t\t\tthis line is for testing htaccess script\n\t\t\t</span>";
    				?>
    					<br /><br />
    				<span style="text-align:center;">
    						<a href="http://validator.w3.org/check?uri=referer">
    						<img src="imgs/validxhtml1.0.png" alt="Valid XHTML 1.0 Transitional" height="31" width="88" border="0" />
    						</a>
    				</span>
    			<div id="menumain">
    				BROWSING LINKS GO HERE
    			</div>
    		</div>

  2.  

  3. #2
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Divs with absolute positioning are effectively pulled out of the document flow, so they won't appear to take up any space. You'll either have to set absolute heights on your containers (in percentages, if you wish) or you'll have to stop using absolute positioning. Your site doesn't seem to be loading for me, so I'm not sure exactly what effect you're going for, but there are usually other (and better) ways to achieve layouts without absolute positioning.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Search tags for this page

div size depending on content

,

div size to content child

Click on a term to search for related topics.
All times are GMT -6. The time now is 09:30 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com