CSS, vertical-align i skleroza
ne mogu nikako da se setim kako da napravim meni od liste, tako da mi text u linkovima budu postavljen na dno (a sam link je blok visine 70px).Ovo je vrlo cesta fora, ali nikako da nadjem neki primer koji je uradjen bez tabela..
Evo kod da bude jasnije sta pricam: Kôd:
<ul id="topMenu"> |
pada mi nesto ovako na pamet
Kôd:
ul#topMenu { |
Kad pre udari na sklerozu? ... Welcome to the club :-)
|
Vertical align osobina za ostale elemente funkcionise malo drugacije od te iste osobine kada je primenjena na td element, tj. celiju tabele.
Ako ti je li element "kontejner", i u njemu hoces da pozicioniras taj link na dno, ja bih ti preporucio da za li das position:relative i onda da link pozicioniras apsolutno sa left:0; bottom:0;, naravno sa display:block; i dimenzijama samog li elementa. Drugo resenje bez APa ti je da koristis padding, tj. da od gorjne ivice paddujes link da bi se on pribio uz donju ivicu, ali ovo ti nije dobar pristup ako moras da imas fiksnu visinu menija. |
E, da, ovo oko vertical-align. Slobodno zaboravi na tu osobinu kroz CSS, ali for the sake of argument, evo ti objasnjenje kako funkcionise (jako debilno IMHO).
Predpostavimo da imamo paragraf i u paragrafu sledeci sadrzaj: Kôd:
<p><img src="path/do/slike.png" width="100" height="100" alt="Slika koja je vislja od jedne linije teksta" /> Ovo je neki tekst pored slike.</p> Kôd:
p *{ vertical-align:middle; } Enivej, totalno ga izbaci kao opciju slobodno, strokav je property totalno. |
Tja, resio sam problem koristeci padding da gurnem link na dole, mada je to mnogo ruzno resenje, jer ako korisnik poveca font onda slova krenu da probijaju sa donje strane... ova druga varijanta sto ste pomenuli sa bottom:0, mi ne radi posao jer link je display:block visine 70px i text ostane na vrhu tog bloka (pozicionira se blok, ali ne i text u njemu)... varijanta koja savrseno radi je display:table-cell u kombinaciji sa vertical-align:bottom, ali narafski to IE ne kapira...
kako bilo, hvala svima, izgubih celu noc na tu glupost ... :1027: |
aha, hoćeš da ti svi 70 pihela visine reaguje na miša... modifikuj html ondak - ubaciš span koji pozicioniraš na patos.
|
verovatno ce trebati jos nekom
http://klodovik.com/css-lab/menu/bottom.html ne svidja mi se kako hover radi. pogledacu kasnije sta se sa njim desava edit: desava se da gledam kroz remote desktop. sve u redu, skleroza ;) |
jebem li ga, umesto tabela ispada da treba da koristim listu sa ubacenim linkovima, a u svakom linku po span... ziveo progres... :/
|
Hahaha, baš ... no, ako već možeš da menjaš html... ne znam ko bi ti zamerio.
|
Ivanhoe, ceo problem ove price je to što imaš fiksno definisan height, a kao što znaš to je depreceated ponašanje. Da si lepo definisao visinu u em-ovima, dao gornji padding -- eto ti mnogo boljeg rešenja koje se daleko bolje skalira. ;)
|
pa da teoretski... ali to bi bilo super kad bi mogao i pozadinu da resizujem (kao u CSS3), ovako sta da radim kad je background picture definisane velicine u pixelima, a nije pattern pa da moze da se tile-uje...
a sto se tice toga da je visina depreciated to me tek nervira... :D |
Citat:
Trenutno ne mogu da se setim ni jednog primera kada mi je bg slika pravila baš takvo ograničenje, jel možeš ilustrovati (ili čak postaviti sliku da vidimo), možda ima rešenja ali ga ne vidiš. :) |
nikada necu razumeti zasto shabani nisu implementirali vertical-align kao shto je na td...
|
Vreme je GMT +2. Trenutno vreme je 11:07. |
Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.