Hogy lehet ezt a kiálló dolgot megoldani css ben?

Nem minden apró design megoldásnak van neve, így szerintem ennek sem. Ezt képpel a legegyszerűbb megcsinálni.

Készítesz egy háromszög alakú fülecskét rajzprogrammal, legyen transzparens a felső része, ahol nem kell takarnia, elmented png-ben. Beleteszed egy abszolút pozicionált div-be, és a sárga dobozod fölött jeleníted meg a megfelelő helyen.

Ez a legegyszerűbb böngészőfüggetlen megoldás.

Létezik még a canvas is, amivel bonyolult alakzatok rajzolhatóak a böngészőben html5 segítségével, de azt sajna az ie régebbi verziói nem támogatják.

Csak css3 megoldással is megoldható kép nélkül (ezt az ie régebbi verziói szintén nem támogatják):

[link]

#kep {position: absolute}

margin-nal játszol :) (szerintem javítsatok ha nem)

(szerintem) azért mert relatívval elcsúszna minden

(szerintem) a sárga divedbe kell tenni, és akkor ahhoz képest lesz abszolút a bal oldaltól pl 20 pxre, és a tetejétől pl -30pxre.

(abszolúttal a mögötte lévő dolgok ugyanott maradnak, relatívval pedig nem fölé tenné, hanem a helyére.)