The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › CSS › CSS rounded corner image help
Hey guys, I have a little problem: [http://halfmug.x10.mx/images/dont.png]
And this is what I want: [http://halfmug.x10.mx/images/want.png]
Now, I had this same issue for the text on top, but I added a (left) floating element before the rest of the content with a small width to fix it and I can’t seem to find out how to fix it on the bottom.
Any ideas?
I assume that your code looks something like that:
<div class=”wrapper”> <h1>Header</h1> <p>Lorem ipsum</p> </div>
You added float to a header element and it works but with css you can’t style last word/line. Try to add more padding:
h1 {padding: 20px 10px 10px;} p {padding: 10px 10px 20px;}
Anyway you could achive same (or quite simillar effect) witout using images: http://nicolasgallagher.com/pure-css-speech-bubbles/ http://nicolasgallagher.com/pure-css-speech-bubbles/demo/
You can’t do that as yet. CSS Regions will probably let you when they are implemented but at the moment….no.
Here’s a hack using a span: http://codepen.io/Paulie-D/pen/knfvo