| Autor | Zpráva | ||
|---|---|---|---|
| Ecrazit Profil * |
#1 · Zasláno: 15. 4. 2012, 04:45:55
Zdravím, už několikrát jsem se s tímhle problémem setkal, ale nikdy jsem ho nevyřešil. Mám na webu nějaké menu, které je tvořeno v tomto stylu
Prostě klasické buttony v určitém divu tvořené pomocí linků v odrážkách. Když ale takto vytvořím menu, nevím jak dosáhnout toho, aby tlačítka vždy vyplnili celý div a vpravo nevznikal prázdný prostor. Samozřejmě automaticky, respektive když se zkrátí text v jednom buttonu, tak se všechny buttonu natáhnou. Jakou metodou se řeší takovýhle typ menu? |
||
| juriad Profil |
#2 · Zasláno: 15. 4. 2012, 09:39:22
můžeš použít tabulku, sama se stará o velikost buněk; pokud tabulku roztáhneš na celou šířku, tak prázdný prostor přidělí jednotlivým buňkám
|
||
| petkahuryska Profil * |
#3 · Zasláno: 15. 4. 2012, 13:03:48
Já použila letter-spacing a text-align: center.
|
||
| margin Profil * |
#4 · Zasláno: 15. 4. 2012, 13:09:31
petkahuryska:
„Já použila letter-spacing a text-align: center.“ Ale na tom není nic automatického, naopak stačí změna textu odkazu nebo fontu a buď se ti to rozpadne nebo vznikne prázdný prostor. |
||
| Someone Profil |
#5 · Zasláno: 15. 4. 2012, 13:11:52
Znáš-li počet položek menu tak to bude 100/počet_položek %
|
||
| Ecrazit Profil * |
#6 · Zasláno: 15. 4. 2012, 15:46:41
Bohužel ani jedna rada nepomohla. Je potřeba aby se to přizpůsobilo, ikdyž někdo změní text v buttono nebo jeden odebere/přidá.
|
||
| juriad Profil |
#7 · Zasláno: 15. 4. 2012, 16:42:05
Ecrazit:
Proč ti nefunguje, nevyhovuje tabulka? <style>
#menu {
width: 100%;
}
#menu table {
width: 100%;
}
#menu td {
padding: 0px;
}
#menu a {
display: block;
}
</style>
<div id="menu">
<table><tr>
<td><a href="prvni.html">Prvni</a></td>
<td><a href="druhy.html">Druhy</a></td>
<td><a href="treti.html">Treti</a></td>
</tr></table>
</div> |
||
| Ecrazit Profil * |
#8 · Zasláno: 15. 4. 2012, 16:46:46
Tabulka by samozřejmě fungovala... jenže záměrem je, aby to menu bylo v CSS, bez použití tabulek
|
||
| margin Profil * |
#9 · Zasláno: 15. 4. 2012, 17:03:05
Tabulky a CSS se nevylučují.
|
||
| Ecrazit Profil * |
#10 · Zasláno: 15. 4. 2012, 17:06:26 · Upravil/a: Ecrazit
řeknu to jinak, je to zakázka s požadavkem, že v kódu nesmí být žádná tabulka :)
Trošku tady nastíním aktuální situaci <DIV s pevnou šířkou 800px> <DIV s šířkou 100%> <UL> <LI><ODKAZ>Různě dlouhý text</ODKAZ></LI> <LI><ODKAZ>Různě dlouhý text</ODKAZ></LI> <LI><ODKAZ>Různě dlouhý text</ODKAZ></LI> </UL> </DIV> </DIV> Existuje tedy nějaký způsob, jak ty odkazy přimět, aby přesně vyplnili celé pole? Bez použítí tabulek? odrážky jsou samozřejmě nastavené jako Inline a mají nastylovaný vzhled buttonů... |
||
| Someone Profil |
#11 · Zasláno: 15. 4. 2012, 17:53:42
Ecrazit:
Takže počet položek není pevně daný? |
||
| Ecrazit Profil * |
#12 · Zasláno: 15. 4. 2012, 17:55:55
Počet položek ani jejich šířka není pevně daná.
|
||
| Someone Profil |
#13 · Zasláno: 15. 4. 2012, 18:05:02
Předpokládám, že se položky menu vypisují z nějaké Databáze, takže tam zasahuje i PHP... Možná neelegantní způsob, ale já bych to vyřešil nějak takto.
|
||
| mimochodec Profil |
#14 · Zasláno: 15. 4. 2012, 18:26:01
Someone:
<li style="width: 16.666666666667%;">Úvod</li> nebo <li style="width: 14.285714285714%;">Úvod</li> .. nic pěknýho.
|
||
| Ecrazit Profil * |
#15 · Zasláno: 15. 4. 2012, 18:26:06
Tenhle způsob mě samozřejmě napad, ale má to bohužel zase svý mouchy... když je některý z textů v menu dlouhý, neudělá to u něj okraje a text je napraný v buttonu bez postranních mezer a padding nelze nastavit, protože to rozhodí ty procentuelní šířky. Druhý problém je, že to nepočítá s border-right:1px solid ...; Naskáčou tam pak pixely navíc a jedne button skočí na druhý řádek,
|
||
| Someone Profil |
#16 · Zasláno: 15. 4. 2012, 18:28:04
mimochodec:
Jak jsem psal... není to nejšťastnější řešení. |
||
| Str4wberry Profil |
#17 · Zasláno: 15. 4. 2012, 18:30:08
Od osmičkového Exploreru to lze řešit pomocí
display a table a table-cell. Ve starších asi jedině tabulkou, protože to dopočítávání dle počtu položek je hezké jenom do doby, kdy je to ukázkový příklad a všechny texty jsou stejně dlouhé.
Případně lze použít Centrování menu s neznámou šířkou, ale nevyužije to úplně ideálně prostor jako ta tabulka. |
||
|
Časová prodleva: 12 let
|
|||
0