Is there any jQuery plugin or CSS trick available which allows me to do this?
+---------------+
|This is a |
|very long |
|text in this |
|div which will |
|overflow and |
+---------------+
+---------------+
|spill into |
|this div. |
| |
| |
| |
+---------------+
EDIT: These 2 divs can be located anywhere in the page and texts have to reside inside the divs.
You can use the CSS position property in combination with the z-index property to overlay an individual div over another div element. The z-index property determines the stacking order for positioned elements (i.e. elements whose position value is one of absolute , fixed , or relative ).
A div can have only one width and only one height, so it can only be a rectangle. You could insert your div1 into div2, and set the content of div2 (including div1) with float:left .
Use CSS position: absolute; followed by top: 0px; left 0px; in the style attribute of each DIV. Replace the pixel values with whatever you want. You can use z-index: x; to set the vertical "order" (which one is "on top"). Replace x with a number, higher numbers are on top of lower numbers.
This is far from the best solution but from the top of my head I'd do it like this-ish:
http://jsfiddle.net/U79Kg/
This might not be what you're after but hopefully a pointer in the right direction!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With