html lista kilóg a div-ből
Biztosan nagyon egyszerű a magyarázat, de nem értem:Egy ilyen szerkezetem van és azt látom, hogy a listában szereplő tételek igazodnak a belső div bal széléhez, a hozzájuk tartozó sorszámok pedig kilógnak még a "wrapper" osztályhoz tartozó div-ből is.
Én rontok/nézek el valamit vagy ez teljesen normális viselkedés?
(ol helyett ul-t használva a pontok lógnak ki)
Másik kérdés: ha itt valójában egy menüféleséget akarok megjeleníteni, akkor mi a "hivatalosan" elfogadott módszer? Táblázat egyetlen oszloppal vagy van rá valami kulturáltabb megoldás is? Mondjuk <dl><dt>...</dt><dt>...</dt></dl>?
■
* {
margin: 0;
padding: 0;
}
.wrapper {
width: 980px;
height: 550px;
background: silver;
padding: 5px;
margin: 40px;
outline: 10px solid white;
border: 1px solid black;
}
.tab {
background: red;
width: 250px;
height: 100%;
float: left;
font-size: 8pt;
border: 1px solid black;
}
<div class="wrapper">
<div class="tab">
<ol>
<li>mokmokmokmokm</li>
<li>mokmokmokmokm</li>
<li>mokmokmokmokm</li>
</ol>
</div>
</div>
Én rontok/nézek el valamit vagy ez teljesen normális viselkedés?
(ol helyett ul-t használva a pontok lógnak ki)
Másik kérdés: ha itt valójában egy menüféleséget akarok megjeleníteni, akkor mi a "hivatalosan" elfogadott módszer? Táblázat egyetlen oszloppal vagy van rá valami kulturáltabb megoldás is? Mondjuk <dl><dt>...</dt><dt>...</dt></dl>?
<div class="wrapper">
Nálam változatlan.
Másik lehetőség
Ez annyit változtatott, hogy
Nomeg előjött a másik problémám, hogy ha a div-be ágyazott div-nek 100% magasságot állítok be, akkor nem veszi figyelembe a különböző border, margin, padding stb. beállításokat, emiatt a bal felső pozicionálás OK, de jobboldalon és alul kilóg a külső div-ből. :-(
* { margin: 0; padding:
margin: 0;
padding: 0;
}
Ezt már csak kínomban tettem
1, A számok pont amiatt
2, a menüt én <ul>-be szoktam tenni.
???? =:-o
Hm... izgalmasan működik. :-)
Szép az egészben, hogy próbáltam a margint 10, a padding-t 5px-re állítani, de nem látszott rajta, hogy változna a megjelenés. Most átírtam 20 és 25px-re, így már valóban belülre kerül.
Köszi.
list-style-position lehet még
padding: 20px 0px 20px 30px;
margin: 0px;
list-style-position: inside;
}
Köszi. Kezdem kaparni a
Kezdem kaparni a tapétát a CSS hülyeségeitől... :-(
Rémlik, hogy sok problémát ki lehet küszöbölni egy CSS Reset beiktatásával (bár ezek inkább a böngészők közti kompatibilitási gondokon segítenek), de pl. olyat elkövetni, hogy egy üres hasáb mérete a körülötte lévő többi dobozhoz dinamikusan igazodjon. Már sokadszor merül fel bennem, hogy kevés ilyen gányolmányhoz volt szerencsém, mint a CSS...
(pláne, ha azt is hozzáveszem, hogy a böngészők képtelenek egyformán kezelni az azonos stíluslapokat)
-----------------------------
Megoldást egyelőre kösz, nem kérek rá, csak leírom, azt ami kiakasztott:
Szerettem volna egy konténert, ami két másik konténert tartalmaz. Ebből az egyik fixen a külső bal széléhez illeszkedne, a másik meg a tőle jobbra lévő teljes területet foglalná el, mindkettő némi margóval és mindkettő magasságát a külső konténerhez igazítanám.
Mindezt úgy, hogy a külső konténer méretét változtatva a beltartalom igazodjon hozzá. Na ezt CSS-ben megoldani, egyelőre úgy tűnik, hogy reménytelen. (pl. ha nem fix magasságot és szélességet adok egy DIV-nek, akkor csak akkorára terjeszti ki magát, amennyi a benne lévő tartalomnak kell.
A CSS-nek nagyon komoly hibái
Egyre több különböző felbontású képernyő lesz, valamelyik nap olvastam (és sajnos most nem találom), hogy egy tíz hüvelykes tabletet kb. 2048x1536-os felbontásúra fog készíteni a gyártója, magyarul egy átlag weboldal nagyon pici lesz rajta, ha meg nagyítasz, széteshet. Ez azt jelenti, hogy meg kéne szabadulni a pixel alapú weblapkészítéstől, ami nem egyszerű, mert a százalék vagy em alapúval bonyolultabb a számolás. Mondjuk sokkal könnyebb lenne szerintem a helyzet, ha a dobozmodellben visszaváltanánk a korábbira, azaz egy elem hosszában benne foglaltatna a margója, paddingja és a keret szélessége.
A HTML alapú webnek ugyanilyen problémái vannak, kezdve ott, hogy a világ nem szöveges dokumentumokból, hanem adatokból áll, azaz eleve rossz a megközelítés, és emiatt a keresés nehézkes, pontatlan, ráadásul csak szavakra lehet az esetek túlnyomó többségében.
Emellett nincs egy támogatott platform, amivel webes alkalmazásokat készíthetünk, olyasmi, mint az ExtJS, csak natívan támogatott objektumokkal, és így a HTML-lel és CSS -sel kell szenvednünk, és azok hibáival küzdeni nap mint nap.
Szerintem a W3C teljesen alkalmatlan arra, amire létrehozták, lassan dolgozik, a problémákat nem ismeri fel. Nekem úgy tűnik, mintha olyanok ülnének ott, akik soha életükben nem készítettek weboldalt, vagy ilyen jellegű problémákat nem oldottak meg, vagy pedig olyanoktól kérnek tanácsot, akik * {margin: 0px; padding: 0px;} definíciókat írnak.
Persze más döntéshozók is hibásak, a nagy cégeknek, mint pl. az Apple vagy a Google - érthető okokból - saját maguk felé hajlik a keze, és ezeket az eleve elhibázott technológiákat (HTML 5, CSS) erőltetik, ahelyett, hogy olyasmin dolgoznának, amitől mindenkinek jobb lesz.
Szerintem egy új szervezetet kéne alapítani, lecserélni a W3C-t, okulva az általuk elkövetett hibákból.
+1
OFF: blog
Mi a helyzet a blogoddal? (http://szemantikus.blog.hu/) Nem fogod folytatni?
K
Sajnos magánéleti dolgok
Az egész célja az, hogy az adatalapú web elgondolásra adjak egy megoldást, amit kidolgoztam. Ehhez készítettem egy backend (PHP) mini-keretrendszert, vagy inkább függvénygyűjteményt, valamint a kliensoldalon is - egy már meglévő rutinkönyvtárat, a Sarissát átdolgozva és kiegészítve - írtam hozzá egy adatfeldolgozó és megjelenítő rendszert, meg persze JS nélkül is működik minden.
A backendet még ki szeretném egészíteni, aztán folytatom a blogot, ahol ezt az egészet bemutatom, és meg is osztom mindenkivel.