CSS Kochbuch

3.15 Abgerundete Ecken bei Spalten mit fester Breite

Problem

Sie wollen Spalten, für die eine feste Breite definiert wurde, mit abgerundeten Ecken versehen.

Lösung

Erstellen Sie für die oberen und unteren Ecken jeweils ein gemeinsames Hintergrundbild (siehe Abbildung 3-28).

Umgeben Sie den Inhalt der Spalte mit einem div-Element:

<div id="box">
 <h2>
  I Met a Girl I&#8217;d Like to Know Better
 </h2>
 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
 nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
 Ut wisi enim ad minim veniam.</p>

</div>

Platzieren Sie das untere Hintergrundbild innerhalb des divs (siehe Abbildung 3-29):

#box {
 width: 214px;

 background-image: url(bkgd_bottom.gif);
 background-position: bottom; ...