Jump to content

Expanding Problem


Asim
 Share

Recommended Posts

Hey guys I got this issue, I got two div tags named content left/right inside another div tag called page_content. Now the problem is that content_right div tag is floated to the right and when I hit enter the page_content does not expand it self. I tried overflow hidden but it still does not work. here is HTML code:

<div id="page_content"> <div id="Content_right" >  </div> <div id="Content_left"> </div></div>

CSS for content_right

margin-right: 20px;width: 250px;overflow: hidden;float: right;

page_content has only one style that is background colour. and content_left has only the width and margin 20px property. I did try to float content_left but then page_content still does not expand it self...

Edited by Asim
Link to comment
Share on other sites

"when I hit enter the page_content does not expand it self" Are you referring to putting a new line in your source code? If so, that will not have any effect on the page (by default) as whitespace is collapsed to a single space. Meaning if you have a sequence of spaces, tabs, and new lines without any text characters mixed in, you will end up with a single space character on the web page.Try entering some actual text and see if the page_content div expands. EDIT: Oh, and you will need to have overflow set to either auto or hidden for the page_content div in order for floated elements to affect its size.

Edited by ShadowMage
Link to comment
Share on other sites

"when I hit enter the page_content does not expand it self" Are you referring to putting a new line in your source code? If so, that will not have any effect on the page (by default) as whitespace is collapsed to a single space. Meaning if you have a sequence of spaces, tabs, and new lines without any text characters mixed in, you will end up with a single space character on the web page.Try entering some actual text and see if the page_content div expands. EDIT: Oh, and you will need to have overflow set to either auto or hidden for the page_content div in order for floated elements to affect its size.
My div never expands in height when content is inserted in to, I got content but the main div is not expanding, I set overflow:auto but still nothing I even set position to fixed, relative, absolute, static none of them work.
Link to comment
Share on other sites

<div id="wrapper">HTML<header><br><br></header><nav><br><br></nav><div id="page_content"><div id="left_container"><article id="art_one"><br><br><br><br><br></article><article id="art_two"><br><br><br><br><br><br><br><br></article></div><div id="right_container"><aside id="asi_one"><br><br><br><br><br><br><br><br><br><br><br></aside></div><br><br><br><br><br><br><br><br><br><br><br><br><br></div><footer></footer></div>

The CSS code:

 #wrapper {margin-left: auto;margin-right: auto;width: 1000px;background-color: #888888;}#header{}/* NAVIGATION SETTINGS */#nav{text-align: center;font-size:14px;}#nav a:link{text-decoration:underline;color:black;}#nav a:visited{color:grey;}#nav a:hover{text-decoration:none;}/* END NAVIGATION */#page_content{position: static;overflow: auto;}#left_container{float:left;width:490px;;}#art_one{-webkit-column-count:3;-mox-column-count:3;column-count:3;-webkit-column-count:40px;-mox-column-count:40px;column-count:40px;}#art_two{}#right_container{float:right;width:490px;}footer {overflow: auto;}

In this one when I hit enter in article or any other div tag the footer does not move it self down..

Link to comment
Share on other sites

In this one when I hit enter in article or any other div tag the footer does not move it self down..
Please clarify what this means. If it means that, in your source code, you change:
<article id="art_one"><br><br><br><br><br></article>

to:

<article id="art_one"><br><br><br><br><br></article>

(For example) I already explained that whitespace collapses. New lines have little or no effect on the placement of elements on the page.I must say, though, that your extraneous usage of <br> tags disturbs me a little. You should use margins or padding to add space between elements.

Link to comment
Share on other sites

Please clarify what this means. If it means that, in your source code, you change:
<article id="art_one">      </article>

to:

<article id="art_one">      </article>

(For example) I already explained that whitespace collapses. New lines have little or no effect on the placement of elements on the page.I must say, though, that your extraneous usage oftags disturbs me a little. You should use margins or padding to add space between elements.

I use margins but just to make this clear for my self when working I use <br/> tag. OK so I removed thetags and put written content there, the problem is that the div (art_one) expands but footer does not move it self down. It hangs in the middle.. Edited by Asim
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...