How do I prevent a div within a div from overlapping? (HTML, CSS)?

L

Lia

New member
I have a large div box with a small div updates box (positioned absolutely) inside, and I want the text in the large div box to go around the small div box, instead of under it. So, in other words, I have the small div box positioned in the corner of the large div box, and I want to have text in there, as well as text outside, in the large div box. But the text in the large div box falls underneath the text in the small div box.

Here's the bit of code I'm working with:

<center><div style="width:750; height:600; overflow: auto; background-color: transparent; border-color:#4C7D7E; border-style: dotted; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; ">
<br><a name="1">| text #1 |
<br>

Large div text, ladeda.

<p><p><p>

<div style="position:absolute; top:115px; left:150px; width:250; height:200; overflow: auto; background-color: transparent; border-color:#4C7D7E; border-style: double; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; scrollbar-face-color: #FFFFFF; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color: #FFFFFF; scrollbar-3dlight-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-darkshadow-color: #FFFFFF; scrollbar-base-color: #FFFFFF;">
Small div text, whoopdedoo.

<p><p>
</div>





</a><br><br>

<a name="2">| text #2 |<p>


<p><p>more text

<p><p>


</a>
<br><br>

<a name="3">| text #3 |<p>


<p>
more text
<p>

<p>

</a><br><br>

<a name="4">| text #4 |<p>

more text


</a>

<br><br>

<br>
<br>
</div>
 
Back
Top