Member Avatar for mohammad_molana

hi all.

i have a problem in div usage.
my divs position image is in attachment.

and this is my html tags:

<div style="width:430px; height:100%">
<div style="width:100px; height:100px; float:right; border:1px solid #333333">&nbsp; </div>
<div style="width:200px; float:right; border:1px solid #333333; margin-right:10px; background-color:#FF0000">&nbsp; </div>
<div style="width:100px; height:100px; float:right; border:1px solid #333333;margin-right:10px;">&nbsp; </div>
<br />
<div style="width:100px; height:100px; float:right; border:1px solid #333333; margin-top:10px">&nbsp; </div>
<div style="width:200px; float:right; border:1px solid #333333; margin-right:10px; margin-top:10px; background-color:#FFFF00">&nbsp; </div>
<div style="width:100px; height:100px; float:right; border:1px solid #333333;margin-right:10px; margin-top:10px">&nbsp; </div>
<br />
</div>

now i want that yellow div go up and grip to red div.

how i do this????
thanks for help.

11.gif 1.69 KB
  • 2 Contributors
  • 2 Replies
  • 94 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by mohammad_molana

Recommended Answers

All 2 Replies

Member Avatar for sreein1986

Hey mohammad_molana
please check this code and check it

<div style="width:430px; height:100%;">
<div style="width:100px; height:100px; float:right; border:1px solid #333333;">&nbsp; </div>
<div style="width:200px; float:right; border:1px solid #333333; margin-right:10px; background-color:#FF0000;">&nbsp; </div>
<div style="width:100px; height:100px; float:right; border:1px solid #333333;margin-right:10px;">&nbsp; </div>
<br />
<div style="width:100px; float:right; border:1px solid #333333; margin-right:10px; left:337px; top:128px; z-index:1; position:absolute; height: 100px;">&nbsp;</div>
<div style="width:200px; float:right; border:1px solid #333333; margin-right:10px; background-color:#FFFF00; left:126px; top:40px; z-index:1; position:absolute; height: 18px;">&nbsp;</div>
<div style="width:100px; float:right; border:1px solid #333333; margin-right:10px; left:12px; top:126px; z-index:1; position:absolute; height: 100px;">&nbsp; </div>
<br />
</div>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.