Welcome to WebmasterWorld Guest from 54.144.77.26

Forum Moderators: not2easy

Message Too Old, No Replies

Positioning absolute div according to the relative div

     

abidshahzad4u

5:49 pm on Oct 11, 2009 (gmt 0)

5+ Year Member



Hi

I have two divs. Div1 and Div2.

Div2 is inside the Div1 and the Div1 is relatively positioned to a text box. Div2 is absolutely positioned. and is displayed to the left of the page.

I want to display both dive under the text box? How can I do this.

If I positioned the Div2 relatively, it push down the whole page.

D_Blackwell

6:23 pm on Oct 11, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



It is difficult to be sure of correctly understanding the relationship with the text box as well as your intentions within Div 1 and Div 2.

Can you strip the HTML and CSS down to the problem itself? If the fix is not found during this process, post the test ready code that replicates the problem and we will look at the options.

This may not be at all what you want, but an additional wrapper will push the <div>s below 'the text box", which I am assuming is a form text box - or you have some other meaning with the phrase? Guessing at content and context.

<!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" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">

</style>
</head>
<body>
<form action="">
<p>
<input type="text"></input>
</p>
</form>
<div style="position: relative;">
<div style="position: relative; border: .1em solid red;">
<div style="position: absolute; top: 0; left: 0; border: .1em solid blue;">
ADAFD
</div>
<p style="margin-left: 25%;">
Div 1
</p>
</div>
</div>
<!--##########
I have two divs. Div1 and Div2.

Div2 is inside the Div1 and the Div1 is relatively positioned to a text box. Div2 is absolutely positioned. and is displayed to the left of the page.

I want to display both dive under the text box? How can I do this.

If I positioned the Div2 relatively, it push down the whole page.
-->
</body>
</html>

D_Blackwell

1:55 am on Oct 22, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Is this on the right track and heading you the right direction? Had to guess a bit.