YourWBB

yourWBB » yourWBB Misc * » Das Proggen » HTML, XHTML, JavaScript & CSS » probleme mit nem horizontalen listenmenü

» Hallo Gast [Anmelden|Registrieren]

Letzter Beitrag | Erster ungelesener Beitrag

2.610 Views | | Thema zu Favoriten hinzufügen

Neues Thema erstellen Antwort erstellen

probleme mit nem horizontalen listenmenü

Autor

Beitrag

« Vorheriges Thema | Nächstes Thema »

PyroGX PyroGX ist männlich

Mitglied

Dabei seit: 17.01.04
Beiträge: 936
Herkunft: Wuppertal

probleme mit nem horizontalen listenmenü

Antworten Zitieren Editieren Melden UP

ich bin gerade an nem neuen design bei dem ich das menu über ne liste horizontal anordnen will

das menü soll exakt 24pixel hoch sein, bei mir ist unter und über dem menü aber noch viel zu viel platz (siehe anhang ff.jpg), beim IE7 nur unten (siehe anhang ie.jpg)

außerdem soll beim hover über den menüpunkt die gesamte breite mit nem anderen bild hinterlegt werden
im FF klappts auch wunderbar (siehe anhang ff_a.jpg)
beim IE ist es nur hinter dem link, wie kann ich das auch dort wie beim FF machen (siehe bild ie_a.jpg)

das ganze ist nicht das originaldesign aber ein originalgetreuer nachbau der sich auf das problem beschränkt

wäre super wenn mir da jemand helfen könnte

/edit den code sollte ich euch auchnoch geben

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Testdesign</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>

body {
margin:0px;
}

.menu ul, .menu li {
display:inline;
width:auto;
height:24px;
margin:0px;
padding:0px;
padding-left:4px;
padding-right:4px;
border-left:#0099FF 1px solid;
}

.menu a {
color:#FFFFFF;
text-decoration:none;
font-weight:bold;
}

.menu li:hover, .menu a:hover {
background-color:#000000;
color:#CCCCCC;
text-decoration:none;
font-weight:bold;
}

</style>
</head>
<body>
<table style="width:100%;" cellpadding="0" cellspacing="0" border="1">
 <tr>
  <td colspan="2" style="height:24px; background-color:#333333;" align="right" valign="top" nowrap="nowrap">
   <ul class="menu">
	<li><a href="#">Testlink 1</a></li><li><a href="#">Link 2</a></li><li><a href="#">Testlink 3</a></li><li><a href="#">Testlink 4</a></li><li><a href="#">Testlink 5</a></li>
   </ul>
  </td>
 </tr>
</table>
</body>
</html>

Dateianhänge:

ff.jpg (12 KB, 121 mal heruntergeladen)
jpg

ff_a.jpg (13,01 KB, 115 mal heruntergeladen)
jpg

ie.jpg (12 KB, 114 mal heruntergeladen)
jpg

ie_a.jpg (13 KB, 114 mal heruntergeladen)

__________________

"A programmer is just a tool which converts caffeine into code"

"Eine Raucherzone im Restaurant ist wie ein Pissbereich im Pool."

Supportanfragen per PN werden komplett ignoriert und nicht beantwortet!!!

Dieser Beitrag wurde 1 mal editiert, zum letzten Mal von PyroGX: 17.03.07 00:14.

17.03.07 00:08

E-Mail WWW Finden Als Freund hinzufügen

faf4life
unregistriert

Antworten Zitieren Editieren Melden UP

Vielleicht habe ich auch was an den Augen, aber zwischen ie_a und ff_a erkenne ich keinen Unterschied, abgesehen von der Höhe.
Was mir aber aufgefallen ist, unter den beiden IE Bildern ist noch ein einzelnes blaues Pixel, warum auch immer...

17.03.07 09:46

PyroGX PyroGX ist männlich

Mitglied

Dabei seit: 17.01.04
Beiträge: 936
Herkunft: Wuppertal

Themenstarter Thema begonnen von PyroGX

Antworten Zitieren Editieren Melden UP

hm, stimmt, das klappt ja nun tatsächlich auch im IE, kurz bevor ich die screens gemacht habe wars noch anders

aber das andere problem besteht immernoch unglücklich

__________________

18.03.07 02:37

E-Mail WWW Finden Als Freund hinzufügen

lycoos lycoos ist männlich

Frauenstimme 2007

Dabei seit: 05.08.05
Beiträge: 1.076

Antworten Zitieren Editieren Melden UP

hast du es schon mit einzelnden angaben wie margin-top ect. versucht?

see:http://www.css4you.de/marginproperty.html

__________________
mfg

der Lycoos

Der Satz des Pythagoras umfasst 24 Worte,die Zehn Gebote 279, die amerikanische Unabhängigkeitserklärung 300 und die Verordnung der EG über die Einfuhr von Karamelbonbons 25.911 Worte.

Dorfsuche

18.03.07 12:56

E-Mail Finden Als Freund hinzufügen

PyroGX PyroGX ist männlich

Mitglied

Dabei seit: 17.01.04
Beiträge: 936
Herkunft: Wuppertal

Themenstarter Thema begonnen von PyroGX

Antworten Zitieren Editieren Melden UP

jo, habe ich und hat nichts gebracht unglücklich

__________________

19.03.07 19:24

E-Mail WWW Finden Als Freund hinzufügen

PyroGX PyroGX ist männlich

Mitglied

Dabei seit: 17.01.04
Beiträge: 936
Herkunft: Wuppertal

Themenstarter Thema begonnen von PyroGX

Antworten Zitieren Editieren Melden UP

ich habe inzwischen nochmal selber dran gebastelt, es ist besser geworden aber immer nochnicht so wie es sein soll

wenn ich ins li-css "float: right;" reinschreibe gehts aber es wird falschrum angezeigt und es ist vertigkal nicht mittig, somit kann es nicht "die lösung" sein, wäre super wenn mir beim neuen code jemand helfen könnte

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Testdesign</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
margin:0px;
}

.menu ul {
height:24px;
margin:0px;
}

.menu li {
height:24px;
margin:0px;
display:inline;
width:auto;
}

.menu a {
height:24px;
color:#FFFFFF;
text-decoration:none;
font-weight:bold;
margin: 0px;
padding:0px 5px 0px;

}

.menu li:hover, .menu a:hover {
color:#000000;
background-color:#FFFFFF;
margin:0px;
}

td.menu, div.menu {
height:24px;
background-color:#333333;
text-align:right;
margin:0px;
padding:0px;
}
-->
</style>
</head>
<body>
<br />
<table style="width:100%;" cellpadding="0" cellspacing="0" border="0">
 <tr>
  <td colspan="2" class="menu" align="right" valign="middle">
   <ul class="menu">
	<li><a href="#">Testlink 1</a></li><li><a href="#">Link 2</a></li><li><a href="#">Testlink 3</a></li><li><a href="#">Testlink 4</a></li><li><a href="#">Testlink 5</a></li>
   </ul></td>
 </tr>
</table>
<br />
<div class="menu">
   <ul class="menu">
	<li><a href="#">Testlink 1</a></li><li><a href="#">Link 2</a></li><li><a href="#">Testlink 3</a></li><li><a href="#">Testlink 4</a></li><li><a href="#">Testlink 5</a></li>
   </ul>
</div>
</body>
</html>

__________________

28.03.07 19:10

E-Mail WWW Finden Als Freund hinzufügen

Baumstruktur | Brettstruktur

Gehe zu:

Neues Thema erstellen Antwort erstellen

yourWBB » yourWBB Misc * » Das Proggen » HTML, XHTML, JavaScript & CSS » probleme mit nem horizontalen listenmenü