Autor Zpráva
habendorf
Profil
#1 · Zasláno: 10. 12. 2004, 13:17:40
Odpovědět Citovat
Můžete si prosím někdo, zobrazit toto v IE, protože nevím jak to popsat. Asi "jedna centrovaná řada dvouřádkových linků" 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

<head>

	<title>Untitled</title>

	<style>

	.menu		{text-align: center; margin-left:auto; margin-right:auto; font-size: xx-small}

    .item		{width: 100px; border: 1px solid red}

	</style>

</head>

<body>

<div class="menu">

   <span class="item"><a href="nekam">aaa<br>bbb</a></span>

   <span class="item"><a href="nekam">aaa<br>bbb</a></span>

   <span class="item"><a href="nekam">aaa<br>bbb</a></span>

   <span class="item"><a href="nekam">aaa<br>bbb</a></span>

</div>

</body>

</html>


IE a Opera OK, v Gecku katastrofa. Zkoušel jsem všechno možné...
Původně jsem to měl celé přes float: left, ale nešlo mi to pak celé vycentrovat.
Štve mě, že to vypadá hrozně jednoduše a přitom jsem v koncích...
habendorf
Profil
#2 · Zasláno: 10. 12. 2004, 13:18:44
Odpovědět Citovat
Nějak to ten kód divně rozhazuje.
Thalia
Profil *
#3 · Zasláno: 10. 12. 2004, 13:38:12
Odpovědět Citovat
No já bych viděla problém v tagu <br >, který je v tom <span > (řádkový element). Protože když to br smažu, tak to pak vypadá dobře, jen ten odkaz není dvouřádkovej. Takže bych span vyměnila za div.
Honza Hučín
Profil
#4 · Zasláno: 10. 12. 2004, 13:40:36
Odpovědět Citovat
Potíž je v tom, že se snažíš nastavovat šířku pro řádkové prvky (<span>), což se nesmí a Mozilla to samozřejmě ignoruje. Zkusím se na to podívat a navrhnout řešení.
habendorf
Profil
#5 · Zasláno: 10. 12. 2004, 13:41:19 · Upravil/a: habendorf
Odpovědět Citovat
Thalia: To jsem původně měl v divech a skládal je vedel sebe pomocí float: left, ale necentrovalo se to pak. Takhle: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

<head>

	<title>Untitled</title>

	<style>

	.menu		{text-align: center; margin-left: auto; margin-right: auto; font-size: xx-small}

    .item		{width: 100px; border: 1px solid red; float: left}

	</style>

</head>

<body>

<div class="menu">

   <div class="item"><a href="nekam">aaa<br>bbb</a></div>

   <div class="item"><a href="nekam">aaa<br>bbb</a></div>

</div>

</body>

</html>
habendorf
Profil
#6 · Zasláno: 10. 12. 2004, 13:42:19
Odpovědět Citovat
Honza Hučín: to jsem jen zapoměl odmazat z původního řešení s divy, viz výše
Honza Hučín
Profil
#7 · Zasláno: 10. 12. 2004, 13:44:39 · Upravil/a: Honza Hučín
Odpovědět Citovat
Necentruje se to proto, že div neměl nastavenou šířku a IE navíc neumí margin-left:auto, pokud je v quirk modu (a IE 5.x to neumí vůbec).

Doporučuji tedy

body {text-align:center}
.item {width: 100px; border: 1px solid red;display:block;float:left}
a do .menu přidat width:420px (nebo tak nějak)
habendorf
Profil
#8 · Zasláno: 10. 12. 2004, 13:56:11
Odpovědět Citovat
Já tam tu šířku dokonce měl, ale blbě. Ale pořád mi to připadá jako trochu nečisté řešení díky tomu width:420px (nebo tak nějak). Když budu chtít přidat položku, budu muset tu hodnotu měnit. Navíc zase browsery tu šířku počítají malinko odlišně (ale ty rámečky tam samozřejmě nebudou, vynuluju padding a margin a už by to mohly počítat dost podobně).
Nicméně problém to řeší, takže velké DÍKY!
habendorf
Profil
#9 · Zasláno: 10. 12. 2004, 18:10:42
Odpovědět Citovat
Tak jsem znovu v koncích. Celé co jsme tu vytvořili chci dát uplně dolu, řekněme 5px odspoda.
To se mi povedlo jen takhle: 
.menu		{

			 margin-left:auto; margin-right:auto; font-weight: normal; font-size: 9px; line-height: 8pt; width: 744px;

			 position: absolute; bottom: 5px

			}

.item       {width: 80px; float:left; margin: 0px; padding: 0px}
, ale zas to přestane centrovat horizontálně (to mám v body).
Víte někdo prosím co s tím?
Honza Hučín
Profil
#10 · Zasláno: 10. 12. 2004, 21:22:58
Odpovědět Citovat
To je tím absolutním pozicováním.
Nabízí se přidat do .menu {left:50%; margin-left:-372px} a vyhodit ten margin-right. Těch 372 je polovina ze 744 ;-)
habendorf
Profil
#11 · Zasláno: 11. 12. 2004, 14:45:41
Odpovědět Citovat
Honzo díky, funguje to.
Ale je tu další problém: pokud je stránka delší a roluje se, cpe se to menu 5px od kraje monitoru, takže někam doprostřed stránky. Pouze jediná Opera pochopila, že to má být na konci stránky a ne na konci monitoru.
Chtěl bych, aby menu bylo dole, ale až na konci stránky. Pokud je stránka krátká, bude následovat prázdné místo a dole menu. Pokud je dlouhá (roluje), bude menu samozřejmě až na konci. Jak na to?
Sakra vypadá to jednoduše, ale skoro mám dojem, že na to css nestačí a bude se muset skriptovat.
habendorf
Profil
#12 · Zasláno: 12. 12. 2004, 15:27:18
Odpovědět Citovat
Tak co, nevíte někdo?
Fred
Profil
#13 · Zasláno: 12. 12. 2004, 18:02:23
Odpovědět Citovat
Taky jsem to zkoušel a když to nešlo trochu jsem hledal a zdá se, že asi bude nutno skriptovat, protože by tady http://www.alistapart.com/articles/footers/ určitě našli lepší řešení
habendorf
Profil
#14 · Zasláno: 12. 12. 2004, 19:47:42
Odpovědět Citovat
Jo Frede, díky. Nemám čas to teď zkoušet, ale vypadá to velmi nadějně :o)
Honza Hučín
Profil
#15 · Zasláno: 13. 12. 2004, 08:40:06
Odpovědět Citovat
Nejjednodušší řešení je podle mě zařadit menu v toku dokumentu za tělo stránky. Pak se vypíše na konci stránky za tělem. Tedy:

...
<div id="telo">
...
</div> <!-- konec těla stránky -->
<div id="dolnimenu">
...
</div>

Pokud bys chtěl mít tělo absolutně pozicované, bylo by potřeba tělo a menu obalit dalším DIVem a absolutně pozicovat ten.
habendorf
Profil
#16 · Zasláno: 13. 12. 2004, 18:50:54
Odpovědět Citovat
Honza Hučín: Honzo, jde mi o to, aby pokud je stránka krátká (třeba jen pár řádků), tak aby menu bylo až na spodku okna. A když je dlouhá (roluje se), aby bylo kousek za koncem stránky. Pokud to dobře chápu, tak to tvoje řešení to neřeší. Nicméně ten odkaz od Freda je dobrej. Jak jsem očekával, bude třeba skriptovat (na což se ale možná vykašlu, nevím jestli to má cenu).
Časová prodleva: 19 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0