guten morgen Ihr lieben,
ich habe 1 probleme.
das 1 ist ich würde gerne die Navbutton etwas nach unten haben damit sie sich nach oben öffnen können und dadrunter einen schwarzen strich. Ich bekomme es nicht hin bin ich doof?
Ja bin ich
danke
hier sind die Daten:
Marco Hoppe[homepage]
php
css
ich danke schon mal im Vorraus
ich habe 1 probleme.
das 1 ist ich würde gerne die Navbutton etwas nach unten haben damit sie sich nach oben öffnen können und dadrunter einen schwarzen strich. Ich bekomme es nicht hin bin ich doof?
Ja bin ich
danke
hier sind die Daten:
Marco Hoppe[homepage]
php
Code:
<TITLE>Marco Hoppe[homepage]</TITLE>
<link rel="stylesheet" type="text/css" href="style1.css"/>
<style type="text/css">
</style>
</head>
<body>
<div id="gesamt" style="margin-top:90px">
<div class="animatedtabs">
<ul>
<!-- CSS Tabs -->
<li><a href="index.php"><span>Startseite</span></a></li>
<li><a href="Übermich.php"><span>Über mich</span></a></li>
<li><a href="Services.php"><span>Service / Leistung</span></a></li>
<li><a href="Kontakt.php"><span>Kontakt/Impressum</span></a></li>
<li><a href="Projekte.php"><span>Projekte</span></a></li>
</ul>
</div>
</div>
</body>
css
Code:
body, .bet {
background-image: url(stripe1.png);
}
#gesamt {
margin:0 auto;
width:600px;
height:600px;
text-algin:left;
background:#FFFFFF url(container.jpg) repeat-y;
border:2px solid #000000;
}
div{
padding: 0 px;
width: 600px;
height: 700px;
border: 2 px;
margin: 0 auto;
background: url(container1.gif) ;
text-align: left;
background-position: 0 auto; /* Containerabstand zu #gesamt nach oben*/
background-repeat: no-repeat;
}
h2 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #000;
margin: 0px;
padding: 0px 0px 0px 15px;
}
body {
margin:0;
padding:0;
font: bold 11px/1.5em Verdana;
}
h2 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #000;
margin: 0px;
padding: 0px 0px 0px 15px;
}
<style type="text/css">
.animatedtabs{
border-bottom: 1px solid gray;
overflow: hidden;
width: 100%;
font-size: 14px; /*font of menu text*/
}
.animatedtabs ul{
list-style-type: none;
margin: 0;
margin-left: 1px; /*offset of first tab relative to page left edge*/
padding: 0;
}
.animatedtabs li{
float: left;
margin: 0;
padding: 0;
}
.animatedtabs a{
float: left;
position: center;
top: 5px; /* 1) Number of pixels to protrude up for selected tab. Should equal (3) MINUS (2) below */
background: url(tab-blue-left.gif) no-repeat left top;
margin: 0;
margin-right: 3px; /*Abstand zu nächsten TAB*/
padding: 0 0 0 9px;
text-decoration: none;
}
.animatedtabs a span{
float: left;
position: relative;
display: block;
background: url(tab-blue-right.gif) no-repeat right top;
padding: 5px 14px 3px 5px; /* 2) Padding within each tab. The 3rd value, or 3px, should equal (1) MINUS (3) */
font-weight: bold;
color: black;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
.animatedtabs a span {float:none;}
/* End IE5-Mac hack */
.animatedtabs .selected a{
background-position: 0 -125px;
top: 0;
}
.animatedtabs .selected a span{
background-position: 100% -125px;
color: black;
padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
top: 0;
}
.animatedtabs a:hover{
background-position: 0% -125px;
top: 0;
}
.animatedtabs a:hover span{
background-position: 100% -125px;
padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
top: 0;
}
</style>
ich danke schon mal im Vorraus