Article és Aside azonos magassággal HTML-ben?
Sziasztok,
kérdésem az lenne, hogy ha készítek HTML nyelven egy oldalt és van benne egy tartalmi rész (article) és egy oldalsáv (aside) akkor be lehet valahogy állítani, valamilyen CSS utasítással megadni, hogy ezek ugyan olyan magasságúak legyenek, függetlenül a bennük lévő tartalomtól?
Ugye az oldalsávot float: right-al jobbra helyezem, hogy egymás mellett legyen a tartalom és az oldalsáv. Viszont hülyén néz ki ha a két egység nem ugyanolyan magas, nyilván be lehet állítani mind kettőnek ugyanazt a height-et, csak felmerült bennem a kérdés, hogy nem lehet ezt valahogy automatikusra állítani, ha később módosítom a tartalmat akkor ne kelljen átírni a heigh-eket.
Tudtok segíteni? :)
(még csak most tanulom a HTML-t szóval bocsi ha ez amúgy hülye kérdés)
"ezek ugyan olyan magasságúak legyenek, függetlenül a bennük lévő tartalomtól"
"valahogy automatikusra állítani, ha később módosítom a tartalmat akkor ne kelljen átírni a heigh-eket"
Ha a tartalomtól függetlenül legyen fix mérete, akkor a későbbi tartalomváltoztatásnál miért írnád át a height-et?
Úgy gondoltam, hogy csinálok több menüpontot, de ugye az oldalszerkezet minden menüpontban azonos, és ha a kezdőlapon van mondjuk 5 bekezdés, akkor pl a tartalmi egységnek 500 pixel magasnak kell lenni, de ha egy másik menüpontban csak egy galéria van, ott elég például 300 pixel magasság.
Így értem azt, hogy később át kell írni, és ilyenkor id-zni kell minden menüpontban az article-t és az aside-ot. És nyilván ez megoldható, csak hosszadalmas, erre irányult a kérdésem, hogy lehet-e egyszerűbben.
Konkrétan itt a site amin dolgozok: [link]
Ha csak szabadon hagyom, hogy a tartalom határozza meg a magasságot akkor az oldalsáv és a tartalom nem lesz azonos magas, mindig kitalálni hogy kábé mekkora magasságot kell mindkettőnek beállítani, hogy azonosak legyenek meg hosszadalmas és minden oldalon osztályozni kell.
Nos érthető, hogy mire gondolsz, de sajnos sem.
Mivel másik oldal, másik fájl, hiszen nem ajax-szal vagy jQuery-vel hívod be a tartalmat, így kénytelen vagy fájlonként megadni a height-et.
A html és a css statikus nyelv. Amiről te beszélsz az pont dinamikus, ahhoz más nyelvet és fájlt is be kéne hoznod. Ha kicsit utána olvasol, akkor a jQuery if függvényével nagyon egyszerű.
A html-ben inkább class-okat és ne id-ket használj, akkor pedig a jquery-ben ezekből generálj "var" paranccsal függvényt, majd "if" művelettel nyerd ki, hogy a class típusa szöveg-e, ha igen akkor "height" legyen 500px, "else" (nem szöveg) esetben pedig 300px. Tény, ha szeretnél egy harmadik lehetőséget (szöveges tartalom 500, kép 300, videó 400, kapcsolati űrlap 600), akkor annyi "if"-et kell egybeágyaznod (mint az excelben), amennyi típust akarsz. És ezt a jQuery fájlon belül annyiszor újra kell írnod, ahány oldalad van (hiszen mások a class nevek), de ha a tartalom formázási részét nagyjából meghagynád, akkor elég egy classal felírni, a többihez pedig alkalmazkodik.
Tisztán html+css kombóval nem lehet megoldani.
Legalábbis jelenlegi információim szerint. Én még html4+css2 ben vagyok nagyrészt, mert sokkal többet lehet vele alakítani, de utána nézek html5+css3 felállásban, hátha abban lehet.
Illetve egy kérdéstől független tanács:
A bal oldali sávodat vagy szélesítsd ki, vagy a yt videók méretét csökkentsd. Látom, hogy még most van szerkesztés alatt, szinte 100%, hogy már tervben van, de gondoltam szólok.
Nagyon zavaró, hogy a függőleges fehér elválasztóba belelógnak a videók.
Értem, köszönöm szépen a segítséget. Erre voltam kíváncsi :)
Ezek szerint akkor statikusan nem lehet, csak valamilyen keretrendszerrel. Azok megismerése még csak most fog terítékre kerülni számomra. Azzal fogok majd akkor próbálkozni, ehhez köszönöm az if ciklus leírását.
Igen a honlap igazából gyakorlás szempontjából készül, így nem tökéletes még és hát nagyon nem is lesz publikálva hisz a tartalom sem saját. Szeretek ötleteket megvalósítani, mert ilyenkor jönnek elő bennem a hasonló jellegű kérdések. Amire most választ is kaptam, nagyon szépen köszönöm :)
"A html-ben inkább class-okat és ne id-ket használj, akkor pedig a jquery-ben ezekből generálj "var" paranccsal függvényt, majd "if" művelettel nyerd ki, hogy a class típusa szöveg-e, ha igen akkor "height" legyen 500px, "else" (nem szöveg) esetben pedig 300px. Tény, ha szeretnél egy harmadik lehetőséget (szöveges tartalom 500, kép 300, videó 400, kapcsolati űrlap 600), akkor annyi "if"-et kell egybeágyaznod (mint az excelben), amennyi típust akarsz. És ezt a jQuery fájlon belül annyiszor újra kell írnod, ahány oldalad van (hiszen mások a class nevek), de ha a tartalom formázási részét nagyjából meghagynád, akkor elég egy classal felírni, a többihez pedig alkalmazkodik. "
Mi ez a töménytelen humbug?
Kérdező!
Még mindig én vagyok. Nos sikerült találnom egy leírást, ott találtam egy kis kódsort. Alapnak megteszi, de természetesen ezt át kell írnod neked megfelelőre. Miután kicsit áttanulgattad a jQuery-t, ezt nyugodtan használhatod:
$(document).ready(function()
{
var target = $('#celElem');
var source = $('#forrasElem');
var targetHeight = target.innerHeight();
var sourceHeight = source.innerHeight();
if( sourceHeight>targetHeight ) return;
var sourceRealHeight = source.height();
var padding = sourceHeight-sourceRealHeight;
var borderRadius = 7;
source.height(targetHeight-padding-borderRadius);
});
-------------------------------------
#6:
Szabályzat 3./(i)
"szándékosan hátráltatni a szolgáltatást, bármilyen módon megzavarni a portál működését (Pl. !provokáció!)" (A meghazudtolás, szakmai helyénvalóság megkérdőjelezése provokáció!)
GYIK
"gyűlöletkeltésért, mások sértegeséért, !provokálásért!, vállalkozás, termék, weboldal reklámozásáért, trágárkodásért, rasszista írásokért, közízlés megsértéséért kitiltás jár"
"Ne a válaszokra válaszolj, hanem a kérdésre! Mások válaszáról a véleményed a lefelé és felfelé mutató nyilak segítségével (azaz a válasz értékelésével) közölheted!" ->Ezt jelenleg én is megszegtem, tudom.
UI: Nem létezik "a közösség már átformálta a szabályokat", "nem olyan komoly ez" kibújó indok. Szabályzat, és annak betartása. Igen és nem lehetőségek.
Újfent köszönöm szépen a segítségeteket, a táblázatos megoldás különösen tetszik, nem is tudtam hogy a display-nek vannak ilyen értékei is.
De a jQuery-t is köszönöm, azzal még barátkoznom kell és jobban megismerni a működését, de elmentettem és feltétlen ki fogom próbálni.
Hálás vagyok nektek, egy új tapasztalatot, megoldási lehetőséget köszönhetek meg.
Kapcsolódó kérdések:
Minden jog fenntartva © 2025, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!