Großer Bruder : schwarze Striche entfernen

Hi Leute,
ich bin noch recht neu am htmlen, soweit aber immer ganz gut durchgekommen.
Nun habe ich allerdings ein Problem, an dem ich mir die Zähne ausbeiße.
Vielleicht hat jemand von euch eine Idee. Danke schonmal.

Zwischen den kleinen facebook, youtube und mail- Bildern entstehen immer
so blöde schwarze Striche an der Unterseite.
Die will ich aber nicht. Die Bilder sind eigentlich knapp zugeschnitten.
Die Striche sind auch ohne die Leerzeichen, die ich dazwischen gesetzt habe zu sehen.

Hier der 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" xml:lang="de" lang="de">

<head>
    <title>you're home now, carlos temper</title>
    <link href="stylus.css" type="text/css" rel="stylesheet" />
    <link href='http://fonts.googleapis.com/css?family=Dawning+of+a+New+Day' rel='stylesheet' type='text/css'/>
    <link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico" />
    <link rel="icon" type="image/x-icon" href="images/icon_ct2.ico" />
    <link href="css/lightbox.css" rel="stylesheet" />
    <script src="js/jquery-1.7.2.min.js"></script>
    <script src="js/lightbox.js"></script>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta name="description" content="" />
    <meta name="author" content="Julian Pallaschke" />
    <meta name="keywords" content="" />
    <meta name="generator" content="Webocton - Scriptly (www.scriptly.de)" />
    <meta name="robots" content="index,follow" />

</head>

<body style="background-image: url(images/stoff_brighter2.jpg);
    background-repeat: repeat; background-position: 10px 10px;">

<a
    name="top">
</a>

<div id="header">

<div id="logo">
        }{ carlos temper }{
    </div>

<div id="rechts">

<p align="center">
        <a
            href="mailto:carlostemper@gmx.de" target="_blank">
            <img src="images/mail5.png" width="44" height="44" border="0px
            "alt="mail" />
        </a>

&nbsp;
        <a
            href="http://www.facebook.com/carlostemper.band" target="_blank">
            <img src="images/fb4.png" width="40" height="40" border="0px"
            alt="facebook" />
        </a>

&nbsp;
        <a
            href="http://www.youtube.com/channel/UC4e1tZTFmjaKt7u5fl1sXjg" target="_blank">
            <img src="images/yt3.png" width="40" height="40" border="0px"
            alt="youtube" />
        </a>
    </p>

</div>

</div>

</body>
</html>

und hier das CSS:

body {
    height: 100%;
}

* {
    padding: 0;
    font-family: Dawning of a New Day, cursive;
    color: black;
    border-color: white;

}

hr {
    color: #ffcccc;
    background-color: #ccccff;
    height: 1px;
    border-color: transparent;
}

#header {
    position: relative;
    width: 900px;
    height: 100px;

}

#logo {
    position: relative;
    float: left;
    margin: 0em 0em 0em 1em;
    font-size: 38pt;

}

#rechts {
    position: relative;
    float: right;
    margin: 1em 4em 0.8em 2em;

}

Gruß,
Julian

  1. હેલો

    Hier der HTML-Code:

    Du musst text-decoration für das a-Element auf none setzen.

    http://jsfiddle.net/bdtKZ/

    Den Spass der Korrektur überlasse ich selbstverständlich dir.

    બાય

    --
     .
    ..:
    1. Malcolm vielen Dank, großes Tennis!!!