Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > What's with it anyway? Div inside a div

Reply
Thread Tools

What's with it anyway? Div inside a div

 
 
greenflame
Guest
Posts: n/a
 
      08-13-2007
ok, so here's the deal.
I have a div, which is adjusted to 100% width and 100% height.
I have another div inside (which is relative to it)
Problem is that the outer div is adjusting to the height and width of
the inner div. It's driving me mad.
I tried to play with z-index, with overflow:hidden... nothing. maybe
you can help me.

(using windows xp, internet explorer if it matters)
Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Ardeo Design Studios</title>
<style type="text/css">
body,p,tr,td {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:17px;
}


..container {
/*z-index:1;*/
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:5px solid #ffffff;

}

..bgWords {
background-color:#99CCFF;
font-weight:bold; font-size:36px; color:#212121;
position:relative; top:50; left:50;
width:50%; height:150px; line-height:30px;
/* for IE */ filter:alpha(opacity=40);
/* CSS3 standard */ opacity:0.4;
/* for Mozilla */ -moz-opacity:0.4;
/*overflow:hidden; */
border:1px solid #ffffff;
}
</style>
</head>

<body bgcolor="#333333">
<div class="container">

<div class="bgWords">
aaaa aaaa aaaa baba baba baba caca caca caca dada dada dada eaea eaea
eaea fafa fafa fafa gaga gaga gaga haha haha haha iaia iaia iaia jaja
jaja jaja kaka kaka kaka lala lala lala mama mama mama nana nana nana
oaoa oaoa oaoa papa papa papa qaqa qaqa qaqa rara rara rara sasa sasa
sasa tata tata tata uaua uaua uaua uaua vava vava vava wawa wawa wawa
xaxa xaxa xaxa yaya yaya yaya zaza zaza zaza sometext sometext
sometext sometext
</div>


</div>
</body>
</html>

 
Reply With Quote
 
 
 
 
Matt White
Guest
Posts: n/a
 
      08-13-2007
On Aug 13, 9:17 am, greenflame <(E-Mail Removed)> wrote:
> ok, so here's the deal.
> I have a div, which is adjusted to 100% width and 100% height.
> I have another div inside (which is relative to it)
> Problem is that the outer div is adjusting to the height and width of
> the inner div. It's driving me mad.
> I tried to play with z-index, with overflow:hidden... nothing. maybe
> you can help me.
>
> (using windows xp, internet explorer if it matters)
> Here's the code:
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <html xmlns="http://www.w3.org/1999/xhtml">
> <head>
> <meta http-equiv="Content-Type" content="text/html;
> charset=iso-8859-1" />
> <title>Ardeo Design Studios</title>
> <style type="text/css">
> body,p,tr,td {
> font-family:Geneva, Arial, Helvetica, sans-serif;
> font-size:17px;
>
> }
>
> .container {
> /*z-index:1;*/
> position:absolute;
> top:0px;
> left:0px;
> width:100%;
> height:100%;
> border:5px solid #ffffff;
>
> }
>
> .bgWords {
> background-color:#99CCFF;
> font-weight:bold; font-size:36px; color:#212121;
> position:relative; top:50; left:50;
> width:50%; height:150px; line-height:30px;
> /* for IE */ filter:alpha(opacity=40);
> /* CSS3 standard */ opacity:0.4;
> /* for Mozilla */ -moz-opacity:0.4;
> /*overflow:hidden; */
> border:1px solid #ffffff;}
>
> </style>
> </head>
>
> <body bgcolor="#333333">
> <div class="container">
>
> <div class="bgWords">
> aaaa aaaa aaaa baba baba baba caca caca caca dada dada dada eaea eaea
> eaea fafa fafa fafa gaga gaga gaga haha haha haha iaia iaia iaia jaja
> jaja jaja kaka kaka kaka lala lala lala mama mama mama nana nana nana
> oaoa oaoa oaoa papa papa papa qaqa qaqa qaqa rara rara rara sasa sasa
> sasa tata tata tata uaua uaua uaua uaua vava vava vava wawa wawa wawa
> xaxa xaxa xaxa yaya yaya yaya zaza zaza zaza sometext sometext
> sometext sometext
> </div>
>
> </div>
> </body>
> </html>


Try reversing the position attribute on bgwords and container, so that
bgwords is absolute and container is relative. Is that what you want?

 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      08-13-2007
In article
<(E-Mail Removed) .com>,
greenflame <(E-Mail Removed)> wrote:

> I have another div inside (which is relative to it)
> Problem is that the outer div is adjusting to the height and width of
> the inner div. It's driving me mad.


Your code is not formally correct, you give little clue about
what you are trying to achieve (there is mainly text on the
browser window and that is that). Why do you think you need
absolute positioning?

--
dorayme
 
Reply With Quote
 
rf
Guest
Posts: n/a
 
      08-13-2007

"dorayme" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...

> Why do you think you need
> absolute positioning?


So the text can flow outside the box when you increase your font size, of
course

--
Richard.


 
Reply With Quote
 
dorayme
Guest
Posts: n/a
 
      08-13-2007
In article <H45wi.20007$(E-Mail Removed)>,
"rf" <(E-Mail Removed)> wrote:

> "dorayme" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
>
> > Why do you think you need
> > absolute positioning?

>
> So the text can flow outside the box when you increase your font size, of
> course


<slapsAntennae>Why didn't I think of that?<.../>

--
dorayme
 
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 Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
drag div from inside div to inside another 123Jim Javascript 0 05-16-2011 08:36 AM
DIV inside DIV overflow issue Matt White HTML 6 02-26-2009 11:03 AM
Loading HTML pages inside <div id="x"></div> chakradhari.ashish@gmail.com Javascript 4 06-07-2007 01:43 PM
Q: Div A inside Div B is larger than Div B Dwayne Madsen Javascript 1 06-01-2005 03:02 PM
how to contrain a div inside a div? Dwayne Madsen Javascript 1 06-01-2005 06:23 AM



Advertisments