Div a mefiblogon

« Div »

Mutatok egy CSS tippet. Kiváncsi vagyok, hányan ismerik..Tehát ha mondjuk van nekünk egy fejlécünk, ami így néz ki:

<div id="header"></div>

Ez szép, meg jó, de minek van az a lezárás, ha egyszerűbben is meg tudjuk oldalni:

<div id="header" />

Mielőtt bárki azzal jönne, hogy ez nem valid, szólok, hogy ez valid.

Kommentek

A bejegyzéshez érkezett kommentek, amiket RSS csatornán is követhetsz.

Ismertem már ezt a technikát, de teljesen elfelejtettem hogy itt is hasznosíthatnám. :D Többnyire csak olyan tageknél szoktam, aminek ugye nincs záró tagje, de most evvel jó ötletet adtál. :)

Üres div-ekért ölök.

Balázs: Miért ölsz? Ha pl. akarsz csinálni egy vonalmintát, akkor azt mibe teszed? Mert szépen egy divben kifejezetten jól mutat. Vagy egy fejléc, ami üres (mert aminek benne kell lenni, az máshol van) az is tökéletes. Nincs igazam?

én is használo üres diveket.. pl a headernél a kép háttérként van beállítva..

A headerben a fejlécinformációknak van helyük, például h1 meg a főoldalra visszavezető link. És ezeknek ott a helyük a headerben.

Mefi: miféle vonalmintára gondolsz?

Olyasmire mint mondjuk a <hr />. Tehát a bejegyzés végére egy minta, vagy akármi. És ugye abban nincs semmi, mert CSS-ben adom meg a hátterét. Érted?

Persze, ezt nem csak headernél lehet használni.

mefi: img

és ezt ismered:

több class megadása:

<div class="class1 class2 class3">blabla</div>

suexID, mefi: lófaszt img, lófaszt üres div. Dizájnelemként funkcionáló képeket háttérként adunk meg, ha a bejegyzés végére akarod a mintát pakolni, akkor a bejegyzés div-nek adod meg háttérképként padding-gel. Mert azt úgy illik.

#10

suexId: és mivan ha 100% hosszu csikot akarsz kirajzolni? ^^

#11

moikboy: kár, hogy ez számos böngészőben nem működik, mert azok egy ilyen jó hosszú nevű osztályt fognak keresni. És nem feltétlenül az IE-ről beszélek most.

#12

Mefi: ráadásul ez a bejegyzésed nem is CSS, hanem HTML tipp ;]

#13

Balázs: nem akarok hitvitába belemenni, dizájn célú képeknek üres altot adunk meg, ez benne van a WCAG ajánlásban is.

moikboy: img width 100%

#14

Illetve elismerem, ott a pont, mintát nem lehet így megadni. Mert széthúzza a böngésző. Bocs!

#15

Dizájn célú képeket ismétlem: nem img-vel adunk meg, azt el lehet felejteni. A dizájnképeknek háttérben a helyük.

#16

De én nem ezt mondom neked? <div id="vonalacska" /> és CSS-ben pedig be van neki szépen állítva a háttér stb.

#17

De nem.
<div class="bejegyzes">
bejegyzés tartalma
</div>

A CSS-ben pedig:
.bejegyzes { background: url(hatterkep.gif) bottom repeat-x; padding-bottom: 30px; }

És máris nem kell az üres div. Ha az utolsó bejegyzésnek nem akarsz hátteret adni, akkor annak ha tudsz, külön osztályt adsz, ha nem tudsz, akkor bizonyos böngészőkben (FF, Safari, Konqueror; de nem IE, Opera) működik a következő:

.bejegyzes:last-child { background: none; padding-bottom: 0; }

Hát most már érted-e?

#18

Igen. Ha nem is a bejegyzés tartalmába, de a lábléc tartalmába megoldható a dolog.

Egyébként háttal nem kezdünk mondatot, hehe ;]

#19

Ezt a marhaságot meg kitől hallottad?

A bejegyzésnél miért ne lenne megoldható a dolog, zöldfülű kis bolondgombám?

#20

Megoldható ott is, de jobban tetszene a láblécben arany csillagvirágszállam ;]

#21

fléééém…. *g*

#22

Ne legyél hülye, szépen rezgő hegedűhúrocskám, ne legyél hülye.

#23

Semmi flém nincs itten kéremszépen. Csak alapból szeretjük cukkolni egymást az arany csillagvirágszállammal ;)

#24

Főleg ha valaki nem jön rá, hogy hülye.

#25

Látod, én is erre gondoltam :) Csak épp fordítva.

#26

pff

#27

http://www.w3.org/TR/xhtml1/#C_3

Lehet, hogy valid, de kerülendő. Most megnéztem neked.

#28

De ez csak a bekezdésre vonatkozik, nem? (egyébként tudom, hogy nem használunk üres divet, mert csúnya :) )

#29

Given an empty instance of an element whose content model is not EMPTY (for example, an empty title or paragraph) do not use the minimized form (e.g. use <p> </p> and not <p />).

Fordítsd már le, mit jelenthet az az _an element_; a div modellje pedig nem üres, tehát a <div /> kerülendő.

#30

Ja jó, az csak példa, mellnézést. Az oldalon egy darab üres div nincsen. :)

Új komment

Itt az adott bejegyzésben elhangzottakhoz szólhatsz hozzá. Ha primitív, csúnya, vagy bunkó erkölcsről teszel tanúbizonyságot, tuti, hogy kimoderállak és rosszat mondok rólad. A hozzászólás nem kötelező, amit írsz vállald föl!

Ezeket az adatokat - ha a böngésződ kezeli a kukikat - csak egyszer kell megadnod, később módosíthatod.

Ha van gravatarod - és a gravataros e-mail-címeddel kommentálsz -, akkor az megjelenik. Ha nincs, vagy nem tudod miaz, akkor olvasd el az útmutatót és regisztrálj.

Neved: E-mail címed (nem jelenik meg): Webszájtod (ha van): Kommented: Mennyi négy és egy összege?
Ez védelmi célokat szolgál, szimplán írd be a fenti összeadás összegét!

A kommentedet írhatod nagyobb mezőbe vagy akár formázhatod is, de ha nem szalonképes, akkor moderálom!