WCM Forum - horizontales Menü (display:inline) funktioniert nicht!

WCM Forum (http://www.wcm.at/forum/index.php)

- Programmierung (http://www.wcm.at/forum/forumdisplay.php?f=17)

- - horizontales Menü (display:inline) funktioniert nicht! (http://www.wcm.at/forum/showthread.php?t=230918)

horizontales Menü (display:inline) funktioniert nicht!

Hallo!

Ich zweifel langsam an mir selber :confused:

Die Browser (Firefox 3 , IE7) wollen das Menü nicht horizontal darstellen, egal was ich mache, die Menüpunkte bleiben untereinander!

Hier der Code:

Code:

  ul#top {

    font-size: 0.83em;

    float: left; width: 120px;

    margin: 0 0 1.2em; padding: 0;



  }



  ul#top li {

    display:inline ;

    list-style: none;

    margin: 0; padding: 0.0em;

    list-style-type: none;

  }

  

ul#top a {

     display: block;

    padding: 0.2em;

    font-weight: bold;

    

  }

  

  ul#top h2 {

 font-size: 1em;

    margin: 1.1em 0 0;   padding: 0.2em;

    border-color: #FDDBA5;

    color: #9C7E4D; background-color: #FDDBA5;

  }

und das zugehörige html-file

HTML-Code:

<body>

    

<img src="styles/alexpage/banner.jpg" alt="banner"> 

<ul id="top">

<li><h2>Menue:</h2></li> 

<li><a href="/bla.html">Bla</a></li>  

</ul>

<table class="noborder"  style="border-width:0px; table-layout:fixed ; border-style:none">

// usw..

Vielleicht überseh ich irgendwas grundlegendes aber ich komm zur Zeit einfach nicht weiter...

danke für die Hilfe! :)

Alex

Hi,

ich weiß leider nicht genau was, aber irgendwo hast einen Hund drinnen. Der folgende Code funktioniert problemlos:

HTML-Code:

<html>

<head>

<style type="text/css">

<!--

#nav li {

    display:inline;

}

-->

</style>



</head>

<body>

<ul id="nav">

    <li><a href="/menu2.html">Menu1</a></li> 

    <li><a href="/bla.html">Bla</a></li>  

</ul>

</body>

<html>

Und das H2 im <li> ist nicht schön ;)

[edit]
Uhh... wenn du die <a> innerhalb der <li> auf display:block setzt dann kann es nicht funktionieren!

lg

hm also auch ohne das display:block im <a> Teil ist es noch nicht in einer Linie :confused:

lg

Also wie gesagt, <h2> innerhalb der li ist nicht gut, warum hast du das?

HTML-Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Unbenanntes Dokument</title>

<style type="text/css">

<!--

#top {

    font-size: 0.83em;

    float: left; width: 120px;

    margin: 0 0 1.2em; padding: 0;



  }



  #top li {

    display:inline ;

    list-style: none;

    margin: 0; padding: 0.0em;

    list-style-type: none;

  }

  

#top a {

    padding: 0.2em;

    font-weight: bold;

    

  }

  

h2 {

 font-size: 1em;

    margin: 1.1em 0 0;   padding: 0.2em;

    border-color: #FDDBA5;

    color: #9C7E4D; background-color: #FDDBA5;

  }-->

</style>

</head>



<body>

<h2>Menue:</h2>

<ul id="top">

<li><a href="/bla.html">Bla</a></li>  

<li><a href="/bla.html">Bla</a></li>  

<li><a href="/bla.html">Bla</a></li>  

</ul>



</body>

</html>

Wie soll das ganze denn am Schluss aussehen?
Menü: Menü1 Menü2 Menü3 ?

Ja genau so.

Hab es jetzt aber anders gelöst, ohne <li>

Aber danke für deine Hilfe! :)

Warum ohne <li> ? <li>s sind gut für Menüs, und es ist auch kein Problem das mit css entsprechend anzupassen.
Hast jetzt einfach <a>Link1</a> <a>Link2</a> .. etc? Wennst mir genau sagst was du willst kann ich dir schnell zeigen wie das mit css möglich ist.

lg