Bene: Problem mit Schrift bei menü mit css

Hallo!

Seit nun fast 2 Stunden versuche ich folgendes Problem zu lösen. Ich wäre sehr dankbar wenn mir jemand helfen könnte:

Ich will ein neues Menü für meine Seite erstellen. Zuerst wollte ich es mit dem Rollover-Effekt ( 2 Bilder, wenn man mit der Maus drüberfährt ändert sich das Bild ) mit GoLive machen, habe aber dann gemerkt, dass man es auch mit css, genauer gesagt mir verschiedenen Hintergrundbildern verwirklichen kann. Ich habe bereits ein Menü mit dem RolloverEffekt gemacht. Die Bilder habe ich mit Photoshop erstellt; den Text mit Verdana, fett, 12pt, schärfer. Ergebnis: http://www.englisch-lernen-im-internet.de/Beispiel.gif

Da ich das Menü nun mit css verwirklichen will, habe ich mir eine Beispieldatei http://css.maxdesign.com.au/listamatic/vertical11.htm angeschaut und versucht Sie so abzuändern, dass sie genauso aussieht wie das Menü mit den Bildern. Der Text http://www.englisch-lernen-im-internet.de/test.html ist obwohl ich ihm die gleichen Eigenschaften zugeordnet habe aber nicht annähern so wie das Ergebnis mit den Rollover-Bildern.

Hier der Quelltext meiner Datei:

<html>
<head>
<title></title>
<meta name="author" content="Bene">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
<link href="test.css" rel="stylesheet" media="screen">
</head>
<body >
<div id="navcontainer">
<ul id="navlist">
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
<li><a href="#">Link4</a></li>
<li><a href="#">Link5</a></li>
</ul>
</div>

</body>
</html>

Hier der Text der externen CSS-Datei:

#navcontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
font-family: Verdana, Arial;
font-size: 12pt;
font-weight: bold;
font-color: black;
}

#navcontainer li { margin: 0 0 1px 0; }

#navcontainer a
{
display: block;
padding: 0px 0px 0px 20px;
width: 140px;
background-color: #B4B4b4;
background-image: url(bgbase.jpg);
}

#navcontainer a:link, #navlist a:visited
{
color: #000000;
text-decoration: none;
}

#navcontainer a:hover
{
background-color: #F60;
background-image: url(bgover.jpg);
color: #333;
}

Was mache ich falsch?

Besten Dank!
Bene

P.S Wird das Ändern der Hintergrundbilder mit css von allen Browsern interpretiert?

  1. Hi,

    Was mache ich falsch?

    ich sehe im Ergebnis keinen Fehler. Ist doch alles wunderbar, wo ist Dein Problem?

    Cheatah

    --
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. ich sehe im Ergebnis keinen Fehler. Ist doch alles wunderbar, wo ist Dein Problem?

      Hallo!

      Ich möchte, dass die Schrift bei dem CSS-Menü genauso aussieht wie auf dem Bild. Dass habe ich aber nicht hinbekommen und ich weiß nicht warum sich die Schrift so unterscheidet, obwohl ich doch die gleiche Eigenschaften verwendet haben.

      Viele Grüße
      Bene

      1. Hi,

        Ich möchte, dass die Schrift bei dem CSS-Menü genauso aussieht wie auf dem Bild. Dass habe ich aber nicht hinbekommen und ich weiß nicht warum sich die Schrift so unterscheidet, obwohl ich doch die gleiche Eigenschaften verwendet haben.

        ach so. Das liegt einerseits daran, dass Du die für Bildschirmmedien denkbar ungünstigste Einheit "pt" gewählt hast, und andererseits daran, dass Du die Schriftgröße dem <div> anstatt des <ul> zugeordnet hast. Und natürlich daran, dass unterschiedliche Systeme _immer_ unterschiedlich darstellen.

        Cheatah

        --
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes