Hello all!
I have been doing web design now for about a year and this is the first time I have had a question that I have not found already answered in a forum or book somewhere, so it would really make my day if you all could help me out
I'm trying to have a parent div, with content, and a child div below it with content and not have the two running on top of each other. Here is visual of my goal:
***************************
* |Parent Div| *
* *
* content content content *
* content content content *
* content content content *
* ********************* *
* * |Child Div| * *
* * * *
* * different content * *
* * different content * *
* ********************* *
***************************
I can get the child div at the bottom using CSS:
#childdiv { bottom:0; }
The problem is no matter what I try, the parent div's content runs into the child's!
So I have this:
***************************
* |Parent Div| *
* *
* content content content *
* content content content *
* content content content *
* ********************* *
* *con|ehtlcoDtventcon* *
* *dciofnftentatnlwrwe* *
* *dciofnftentatnlwrwe* *
* *dciofnftentatnlwrwe* *
* ********************* *
***************************
Additional info: I can't use fixed height, or else I know a workaround that would have helped >.<
Here is the html:
<div id="parentdiv"> <div id="childdiv""> <p>Archives</p> <a href="oldblog.html">Old Blog</a> <a href="oldblog.html">Old Blog</a> </div> <p> My content</p> </div>
I have tried "clear: both;", setting margins, padding, and now I really don't know what else to try. Any help would be greatly apprecaited!
PS
I didn't post all the code because most of it is not essential.
Thanks again for any help!
NOTE: I realized I hit the
NOTE:
I realized I hit the quotation button twice by accident in the html code, but I can't find a way to edit the original post.
You don't show it, but I'll
You don't show it, but I'll guess you're using {position: absolute;}. Absolute and fixed position elements are invisible to other elements, and vice versa.
The html you showed us will naturally have the child div precede the parent's other content. Put the parent's other content ahead of the child div you want living at the bottom of the parent.
If that's not what you want, you need to show us more than you have.
cheers,
gary
Quote: I didn't post all the
I didn't post all the code because most of it is not essential.
Yet as seen Gary had to guess at the situation, thus sadly you did not post all the code that was necessary Please observe posting guidelines; posting pertinent code is ok as long as one does actually definitely know what that code is, in this case it was ALL the css that related to those elements shown.
The snippet of CSS you do show actually does nothing in this context; stating simply 'bottom: 0;' in a ruleset has absolutely no effect on the element that has that selector appended to - unless that element has properties applied from another ruleset elsewhere in the stylesheet.