Autor Zpráva
Kaligula
Profil *
#1 · Zasláno: 18. 5. 2006, 19:48:13
Odpovědět Citovat
Ahoj, už jsem to jsem jednou psal, ale teď to je i s obsáhlým příkladem. Potřeboval bych v MENU tvořeném seznamem (<ul><li>) odstranit mezeru, která se dělá pouze v IE. Snažil jsem se to řešit použitím třídy: 
#menu li.ne {list-style: none; border-bottom: none;}
, ale právě to mě udělá tu centimetrovou mezeru. Prosím podívejte se na to. Nevím co s tím a bez toho nemohu pokračovat ve své práci. Dva příklady: Zkuste je a uvídíte rozdíl!!!!!

Příklad 1, rámeček pod položkou! <li> 


<html>

<head>

 

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 <title>Zkušební stránka s menu</title>

 

<style>

#menu {

	width: 400px;

	float: left;

	overflow: hidden;

	padding: 0;

	font: 150% sans-serif, Tahoma, "Geneva CE", lucida;

}

#menu ul {

	margin: 0;

}

#menu li {

	list-style: none;

	border-bottom: 3px solid white;

}

#menu li a {

	display: block;

	padding: 20px 10px;

	text-decoration: none;

	font-weight: normal;

	overflow: hidden;

	color: white;

	background: gray;

}

#menu li a:hover {

	color: black;

	background: silver;

}

</style>



</head>

<body bgcolor="black">

	<div id="menu"> 

	<ul>

		<li><a href="index.php">Hlavni strana</a></li>

		<li><a href="index.php">Hlavni strana</a></li>

		<li><a href="index.php">Hlavni strana</a></li>

	</ul>		

	</div>

</body>

</html>
[/b]


[b]Příklad 2, probém s mezerou, snaha ji vyřešit třídou (.ne), ale právě to je důvod mezery! 

<html>

<head>

 

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 <title>Zkušební stránka s menu</title>

 

<style>

#menu {

	width: 400px;

	float: left;

	overflow: hidden;

	padding: 0;

	font: 150% sans-serif, Tahoma, "Geneva CE", lucida;

}

#menu ul {

	margin: 0;

}

#menu li {

	list-style: none;

	border-bottom: 3px solid white;

}

#menu li a {

	display: block;

	padding: 20px 10px;

	text-decoration: none;

	font-weight: normal;

	overflow: hidden;

	color: white;

	background: gray;

}

#menu li a:hover {

	color: black;

	background: silver;

}



#menu li.ne {

	list-style: none;

	border-bottom: none;

}

</style>



</head>

<body bgcolor="black">

	<div id="menu"> 

	<ul>

		<li><a href="index.php">Hlavni strana</a></li>

		<li class="ne"><a href="index.php">Hlavni strana</a></li>

		<li><a href="index.php">Hlavni strana</a></li>

	</ul>		

	</div>

</body>

</html>


Dívejte se na problém v IE - Internet Explorer. Děkuji, snad mi někdo píchnete. Pro mě je už zoufalství slabé slovo...
bojars
Profil
#2 · Zasláno: 18. 5. 2006, 20:12:29
Odpovědět Citovat
Pri tom prvom riešení nemáš v MSIE žiadnu medzeru... nerozumiem, prečo si použil to s tou triedou???
Kaligula
Profil *
#3 · Zasláno: 18. 5. 2006, 20:20:17
Odpovědět Citovat
Ano, já jsem psal, že chyba se vyskytuje pouze v IE! První řešení funguje bez problému všude, ale můj problém je ten, že nechci rámeček v určité položce "příklad 2", a pak nastává problém v ie, který mě vykreslý asi centimetrovou mezeru, když zruším v některé položce rámeček a dal jsem příklad s tou "třídou", jinak to funguje všude, jen v IE ne.
Kaligula
Profil *
#4 · Zasláno: 18. 5. 2006, 20:22:28
Odpovědět Citovat
Otázka je, jak se zbavit v IE té mezery?
bojars
Profil
#5 · Zasláno: 18. 5. 2006, 21:00:29
Odpovědět Citovat
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Zkušební stránka s menu</title>

<style>
#menu {
width: 400px;
float: left;
overflow: hidden;
padding: 0;
font: 150% sans-serif, Tahoma, "Geneva CE", lucida;
}
#menu ul {
margin: 0;
}
#menu li {
list-style: none;
border-bottom: 3px solid white;
margin: 0;
}
#menu li a {
display: block;
padding: 20px 10px;
text-decoration: none;
font-weight: normal;
overflow: hidden;
color: white;
background: gray;
}
#menu li a:hover {
color: black;
background: silver;
}
#menu li.ne {
list-style: none;
border-bottom: none;
border-bottom: 3px solid black;
display: block;
padding: 20px 10px;
text-decoration: none;
font-weight: normal;
overflow: hidden;
color: black;
background: silver;
}
</style>

</head>
<body bgcolor="black">
<div id="menu">
<ul>
<li><a href="index.php">Hlavni strana</a></li>
<li class="ne">Hlavni strana</li>
<li><a href="index.php">Hlavni strana</a></li>
</ul>
</div>
</body>
</html>
Kaligula
Profil *
#6 · Zasláno: 18. 5. 2006, 23:02:07
Odpovědět Citovat
bojars: Tobě to funguje doma v IE? Mě tedy ne. Je fakt, že mezírka je menší, ale to nic neřeší. Navíc s odkazem se vše vypaduje do větší nesnáze..., ale díky za snahu. Já už jsem to teda doma vyřešil, ale stejně by mě zajímalo jestli to vůbec jde nějak upnout...
Leo
Profil
#7 · Zasláno: 18. 5. 2006, 23:26:41
Odpovědět Citovat
Mezeru kde? Pod kazdou polozkou seznamu? Pokud ano, tak to byva tim display: block pro odkaz, a pomaha napriklad display: inline pro li, mam pocit (coz neni moc koser, a nefunguje pak leccos v kinych browserech, ale existuji i jina reseni), Leo
Kaligula
Profil *
#8 · Zasláno: 18. 5. 2006, 23:44:53
Odpovědět Citovat
Jóóó, ty si pašák. Takový blbůstka. Díky moc..., jen s tim koserem jsem moc nepochopil. Doufám, že to bude fungoval téměř ve všech prohlížečích.
Časová prodleva: 18 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0