wrapper not detecting content

This is a discussion on "wrapper not detecting content" within the Web Page Design section. This forum, and the thread "wrapper not detecting content are both part of the Design Your Website category.



Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices


Reply
 
LinkBack Thread Tools
  #1 (permalink)  
Old Apr 6th, 2008, 21:37
saltedm8's Avatar
Lead Administrator

SuperMember
Join Date: Nov 2005
Location: Always About
Age: 27
Posts: 1,298
Blog Entries: 1
Thanks: 1
Thanked 6 Times in 6 Posts
wrapper not detecting content

i am not sure if the wrapper is detecting the child div's inside it, could someone check it out for me please

thanks

Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--

  /*-------------------------------------------*/
  /*   layout ( non movers )  */
  /*-------------------------------------------*/
#banner_con {
    margin: 0 auto;
    width:962px;
    height:250px;
    margin-top: 10px;
    border:double #CCCCCC;
    background-color:
    
}

#banner {
    float:right;
    width:662px;
    height:195px;
    margin: 5px 5px 5px 0;
    background-color:#FFFFFF;
    background-image:url(images/bannor.JPG);
}

#navigation {
    float: left;
    width:280px;
    height:195px;
    margin: 5px 10px 5px 5px;
    background-color:#FFFFFF;
    background-image:url(images/nav.JPG);
}

#bar {
    float: left;
    width:942px;
    height:30px;
    padding: 7px 10px 5px 10px;
    background-image:url(images/bar.JPG);
}
#wrapper { 
    margin: 0 auto;
    width:962px;
    height:300px;
    margin-top: 5px;
    padding: 0 0 3px 0;
    background-color:#D3D0C7;
    border:double #CCCCCC;

}

#footer { 
    margin: 0 auto;
    width:942px;
    height:120px;
    margin-top:5px;
    margin-bottom:10px;
    padding: 5px 10px 5px 10px;
    background-color:#BB595A;
    border:double #CCCCCC;
    
}
  /*-------------------------------------------*/
  /*   layout ( movers )  */
  /*-------------------------------------------*/

#column_left {  
     float:left; 
     height:50px;
     width: 208px;
     background-color:#FFFFFF;
     margin: 10px 5px 5px 5px;
     padding: 3px 5px 3px 5px;
     border:double #CCCCCC;
}

#column_center_1{    
    width: 462px; 
    height:50px;
    float: left; 
    background-color:#FFFFFF;
    margin:10px 5px 5px 5px ;
    padding: 3px 5px 3px 5px;
    border:double #CCCCCC ;
    
}

#column_center_2{    
    width: 698px; 
    height:50px;
    float: left; 
    background-color:#FFFFFF;
    margin:10px 5px 5px 5px ;
    padding: 3px 5px 3px 5px;
    border:double #CCCCCC ;
    
}

#column_center_3{    
    width: 934px; 
    height:50px;
    float: left; 
    background-color:#FFFFFF;
    margin:10px 5px 5px 5px ; 
    padding: 3px 5px 3px 5px;
    border:double #CCCCCC ;
    
}

#column_center_4{    
    width: 698px;
    height:50px;
    float: left; 
    background-color:#FFFFFF;
    margin:10px 5px 5px 5px ;
    padding: 3px 5px 3px 5px;
    border:double #CCCCCC ;
    
}


#column_right{    
     float:right; 
     height:50px;
     width: 208px;
     background-color:#FFFFFF;
     margin: 10px 5px 5px 5px;
     padding: 3px 5px 3px 5px;
     border:double #CCCCCC ;
    
}

  /*-------------------------------------------*/
  /*   fonts and style  */
  /*-------------------------------------------*/

.breadcrumb { 
     font: Geneva, Arial, Helvetica, sans-serif;
     color: #333333;
     font-size:19px;
     letter-spacing:10px;
     font-variant:small-caps;
     font-weight:bold;
     
}

     
-->
</style>
</head>

<body>
<div id="banner_con">
<div id="navigation"></div>
<div id="banner"></div>
<div class="breadcrumb" id="bar">home-forums-next</div>
</div>
<div id="wrapper">
<div id="column_center_4"></div>
<div id="column_right"></div>
</div>
<div id="footer"></div>

</body>
</html>
p.s - the height attributes are only there temporally
__________________
My Recipe forum...don't click here
Last Blog Entry: Basic Advice for newbies (Feb 1st, 2008)

Last edited by saltedm8; Apr 6th, 2008 at 21:39.
Reply With Quote

  #2 (permalink)  
Old Apr 6th, 2008, 21:43
SuperMember

SuperMember
Join Date: Jun 2007
Location: uk
Posts: 459
Thanks: 0
Thanked 0 Times in 0 Posts
Re: wrapper not detecting content

Looks ok to me.
Attached Images
File Type: jpg Untitled Document_1207517962093.jpg (15.4 KB, 3 views)
Reply With Quote
  #3 (permalink)  
Old Apr 6th, 2008, 21:51
saltedm8's Avatar
Lead Administrator

SuperMember
Join Date: Nov 2005
Location: Always About
Age: 27
Posts: 1,298
Blog Entries: 1
Thanks: 1
Thanked 6 Times in 6 Posts
Re: wrapper not detecting content

thanks for looking

i am just worried that if i remove the height attributes its not doing to 'grow' inside the wrapper because its going to be part of a cms
__________________
My Recipe forum...don't click here
Last Blog Entry: Basic Advice for newbies (Feb 1st, 2008)
Reply With Quote
  #4 (permalink)  
Old Apr 6th, 2008, 22:27
SuperMember

SuperMember
Join Date: Jun 2007
Location: uk
Posts: 459
Thanks: 0
Thanked 0 Times in 0 Posts
Re: wrapper not detecting content

try changing your #wrapper to.

HTML: Select all
#wrapper { 
    margin: 0 auto;
    width:962px;
   overflow: auto;
    margin-top: 5px;
    padding: 0 0 3px 0;
    background-color:#D3D0C7;
    border:double #CCCCCC;

}
then your height attributes in column centre 4 and column right can be set to auto, that should allow the wrapper to expand as the inner divs expand.
Reply With Quote
  #5 (permalink)  
Old Apr 6th, 2008, 22:31
saltedm8's Avatar
Lead Administrator

SuperMember
Join Date: Nov 2005
Location: Always About
Age: 27
Posts: 1,298
Blog Entries: 1
Thanks: 1
Thanked 6 Times in 6 Posts
Re: wrapper not detecting content

fantastic, don't know why i did not think of that, thanks
__________________
My Recipe forum...don't click here
Last Blog Entry: Basic Advice for newbies (Feb 1st, 2008)
Reply With Quote
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Wrapper problem goldy Web Page Design 2 May 30th, 2008 19:11
overhanging an imge in a wrapper div lister110 Website Planning 1 Jan 13th, 2008 18:24
[SOLVED] CSS wrapper affecting body Joolsd186 Web Page Design 7 Dec 31st, 2007 19:11
My navigation breaks my wrapper. tigerslicer Web Page Design 6 Sep 10th, 2007 10:58
Trying to align a div in a wrapper AdRock Web Page Design 7 Feb 22nd, 2007 16:03


All times are GMT. The time now is 16:37.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43