Hirdetés
- Apple iPhone 16 Pro - rutinvizsga
- Samsung Galaxy S23 Ultra - non plus ultra
- Akciófigyelő: Megnyílt a Xiaomi hivatalos magyar webáruháza
- Samsung Galaxy S25 Edge - a tegnap határán
- Elalmásodik a Xiaomi: 100 wattos töltéssel érkezik a 16 Pro Max
- Szuper Szigettel futott be a HyperOS 3
- Samsung Galaxy A55 - új év, régi stratégia
- Mozgóképen a második trifold
- Motorola Edge 50 Neo - az egyensúly gyengesége
- Milyen okostelefont vegyek?
Új hozzászólás Aktív témák
-
T J
tag
Nem tudom, h megoldható-e CSS-ben amit szeretnél: CSS - Use calc() to keep widths of elements the same
Dinamikusan lehet, hogy csak js-el fog menni, illetve bele lehet erőszakolni a js-t css-be, de az nem tiszta css, illetve lehet js-ben is használni css-t, de akkor nem minden stílus lesz a css fájlben egy helyen.
width: calc(...) -al is lehet számolni, de csak az őt tartalmazó elem szélességéből. Másik vele egyenrangú társelem szélessége csak fix értékként szerepelhet a képletben. Pl:
.td3 {width: calc( 100% - 200px ); } ahol 100% az a td3-at tartalmazó tr szélessége, a 200px pedig a sorban levő többi elemé (td1, td2) marginnal, borderrel együtt.
Szóval ha ismered minden oszlopban a leghosszabb elem méretét, akkor érdemes az adott osztályú elemeknek min-width-ként megadni, és az ismeretlen szélességű mezőét a calc()-al megadni, kitöltve így a maradék helyet.
De az inputnál nem tudod előre hogy nem az lesz-e a leghosszabb mező, amit épp be fog írni a user. Így vagy maximálod a beírható karakterek számát, vagy minden beírt karakter után lefuttatsz js-el egy ciklust, amiben összehasonlítod, hogy a beírt szöveg hosszabb-e, mint a már meglévő leghosszabb szöveg az oszlopban, vagy a megadott szélességnél. És ha hosszabb, akkor növeled a cella és táblázat szélességét minden egyes beírt karakternél. De ez sok felesleges számítás, és ha betöltéskor is így állapítod meg a szélességet, min-width helyett, akkor lassabban fog betöltődni az oldalad.Ezen kívül nem illik egy tr-be th-t és td-t is tenni, csak az egyiket. És div-et se erőltetném bele td-be, mert rontja a táblázatod formázhatóságát. Inkább használj div helyett <span>-t.
Új hozzászólás Aktív témák
- Milyen TV-t vegyek?
- Apple iPhone 16 Pro - rutinvizsga
- Képregény topik
- Milyen billentyűzetet vegyek?
- Kerékpárosok, bringások ide!
- TCL LCD és LED TV-k
- Samsung Galaxy S23 Ultra - non plus ultra
- BMW topik
- Büszke apukák és anyukák topikja
- Akciófigyelő: Megnyílt a Xiaomi hivatalos magyar webáruháza
- További aktív témák...
Hirdetés
- Samsung Galaxy A12 64GB Kártyafüggetlen 1 év Garanciával
- Prémium PC házak akár 20-40% kedvezménnyel eladók garanciával, számlával!
- Bomba ár! HP EliteBook 840 G5 - i5-8G I 8GB I 128GB SSD I 14" FHD I HDMI I Cam I W11 I Gari!
- ÁRGARANCIA!Épített KomPhone Ryzen 5 7600X 32/64GB RAM RTX 5070 12GB GAMER PC termékbeszámítással
- GYÖNYÖRŰ iPhone 15 Plus 128GB Pink -1 ÉV GARANCIA - Kártyafüggetlen, MS3354
Állásajánlatok
Cég: CAMERA-PRO Hungary Kft.
Város: Budapest
Cég: FOTC
Város: Budapest