Modulfejléc Stílus Tipp #03
A lényeg annyi lenne hogy meg tudjátok csinálni ezt:

Itt a modulfejléc kódjával kellett cigánykodni egy kicsit, illetve pár + nagyobb paddingot hozzá kellett adni a kódhoz :) Kiszedtem a modulfejléc kódjából a lényeges sorokat.
.column_side td.modtitle {
display: inline-block;
position:absolute!important;
margin-top:-10px!important; }
Elemezzük! Az első display:inline-box gondoskodik nekünk arról hogy akkora legyen maga a modulfejléc mint a benne található szöveg, ez szépen látszik a háttérről is, persze kicsit rakoncátlanabb is lett :) A position:absolute gondoskodik arról hogy az egészet mozgatni lehessen. És végül a margin-top tulajdonság miatt mászik rá a modulfejléc a modulbody-ra.
Magát a keretet természetesen a .column_side td.modbody-nál adtam meg egy 4px-el double keret minden oldalon :)
Amire figyelni kell!
-
Mivel a modulfejlécet rátoltuk a tartalomra érdemes a modbody-nak (esetünkben .column_side td.modbody) egy nagyobb felső padding-ot adni (padding-top: 35px)
-
Mivel az a fárnya modulfejléc össze vissza csúszkál ezért magának az oldalmodul blokknak(.column_side) is érdemes paddingot felállítani felül.
|