Hi,
It seems that after applying overflow:hidden to a div, its contents
respect the parent's padding except for the bottom-padding. Is there a
way to overcome this? I can only think of wrapping the overflowing div
inside another div, but it seems like a bad solution.
Here's the code:
//CSS//
#wrapper {
height: 145px;
background-color: red;
padding: 40px;
overflow: hidden;
}
#phrases {
background-color: lightblue;
z-index: -10;
}
<!--HTML-->
<div id="wrapper">
<div id="phrases">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas
auctor velit vel eros. Cras tellus arcu, pulvinar elementum, rutrum
et, porta ultrices, est. Vestibulum libero ante, cursus eu, ultrices
quis, cursus eget, mi. Nullam ac lorem. Aliquam suscipit turpis eget
sapien. Mauris et justo. Mauris nec enim ac urna tempus ultricies.
Suspendisse dignissim. Donec at turpis. Nullam dictum convallis eros.
Pellentesque molestie facilisis magna. Maecenas vel odio. Nullam eu
ipsum. Ut in ante. Cras tellus. Cras nunc tortor, posuere eu, lacinia
et, mollis in, purus. Morbi orci ligula, sodales vitae, faucibus
tempus, tempor eget, purus. Nullam quam. Morbi venenatis, felis in
tincidunt varius, metus turpis varius turpis, at volutpat arcu sapien
vel leo. Aliquam porta vulputate diam. Aenean ante. Integer pede arcu,
bibendum aliquet, rhoncus id, laoreet et, ante. Phasellus mattis.
Proin vel quam. Vivamus mollis leo vel nibh auctor dignissim. Maecenas
posuere metus id augue. Pellentesque aliquet quam et felis. Fusce
hendrerit iaculis augue. Sed id lectus. Aliquam mi.
Morbi ornare pharetra felis. Cum sociis natoque penatibus et magnis
dis parturient montes, nascetur ridiculus mus. Sed suscipit, purus non
commodo accumsan, tellus leo vestibulum tortor, vitae consequat nisi
felis sit amet quam. Fusce leo justo, laoreet at, venenatis in,
euismod id, orci. Nunc risus leo, fringilla vel, iaculis sit amet,
commodo et, elit. Phasellus a arcu. Morbi at est. Fusce imperdiet, sem
nec feugiat gravida, odio orci mollis dolor, et aliquet tellus turpis
ac leo. Integer elit. Pellentesque rutrum vestibulum libero. Phasellus
sapien nunc, laoreet et, commodo non, volutpat condimentum, nisl.
Aenean sodales nulla vitae lacus. Mauris faucibus, lectus nec
fringilla facilisis, lacus justo rhoncus risus, eu porta nulla nisi
sit amet pede. Sed accumsan mi sit amet orci. Maecenas ipsum leo,
viverra ut, fringilla sed, venenatis eget, lectus. Class aptent taciti
sociosqu ad litora torquent per conubia nostra, per inceptos
himenaeos. Aliquam magna. Pellentesque iaculis egestas est. Integer
posuere tristique augue.
</div>
</div>
Thanks,
Nacho
--~--~---------~--~----~------------~-------~--~----~
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: [email protected]
To unsubscribe: [email protected]
-~----------~----~----~----~------~----~------~--~---
