- Android alkalmazások - szoftver kibeszélő topik
- Fotók, videók mobillal
- Okosóra és okoskiegészítő topik
- Bluetooth-headsetekről általában
- Megérkeztek a Xiaomi 15T sorozatának telefonjai Magyarországra
- iPhone topik
- Vivo X200 Pro - a kétszázát!
- Samsung Galaxy S22 és S22+ - a kis vagány meg a bátyja
- OneOdio Focus A6 – Bluetooth 6-ot olcsón
- Apple iPhone Air - almacsutka
Új hozzászólás Aktív témák
-
martonx
veterán
2-esre egy lehetséges megoldás? https://jsfiddle.net/m2x7wt6e/1/
-
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
- Battlefield 6
- Formula-1
- Android alkalmazások - szoftver kibeszélő topik
- Építő/felújító topik
- Fotók, videók mobillal
- Okosóra és okoskiegészítő topik
- Mi történik a szemeddel, ha napi 8 órát monitort nézel? | Orvos válaszol
- Gitáros topic
- Milyen notebookot vegyek?
- sziku69: Szólánc.
- További aktív témák...
- Western Digital WD Purple 4TB - WD40PURZ - Új, bontatlan - Eladó!
- WD Black SN850P 4TB M.2 NVME PCI-E 4.0 x4 - Új - 7300-6600 MBs - Eladó!
- Fujitsu Lifebook A357 (i3 6th, 8 GB 250 GB FHD) laptop leárazás!!! AkciÓÓ!
- ÚJ! GAMER PC I5-14600KF RX 9060XT RTX 5060Ti RTX 5070Ti RTX 5080 32/64GB DDR5 számlás!
- Vivobook Pro 15 N6506MV 15.6" QHD+ OLED Ultra 9 185H RTX 4060 24GB 1TB NVMe IR kam gar
- KERESEK: Poly Voyager 4320 M UC USB-C 218478-02M Part number: 77Z30AA
- Telefon felvásárlás!! iPhone 13 Mini/iPhone 13/iPhone 13 Pro/iPhone 13 Pro Max/
- GYÖNYÖRŰ iPhone 13 Pro 256GB Sierra Blue -1 ÉV GARANCIA - Kártyafüggetlen, MS3360
- HPE Aruba switch, 48G PoE+, 4SFP+, L3, Smart managed
- Creative Sound BlasterX G6 7.1 USB külső hangkártya
Állásajánlatok
Cég: Laptopműhely Bt.
Város: Budapest
Cég: PCMENTOR SZERVIZ KFT.
Város: Budapest