63130
19.11.2008, aktualisiert um 10:26:05 Uhr
4109
2
0
Text verschiebt sich ungewollt nach unten
Ich schreibe gerade an einer Seite auf welcher ich eine neue Navigation im Registerkarten-Stil teste. Dabei verschiebt sich der Text in der Registerkarte allerdings ungewollter Weise nach unten.
Hier erstmal ein Screenshot der Seite:
Oben in den Registerkarten verschiebt sich der Text "Test" weiter nach unten, sogar aus dem DIV raus. Der Text sollte mit dem "Testlink" auf einer höhe liegen.
Hier der Quelltext der Seite:
und hier das CSS:
Kann mir da jemand helfen? Ich hab schon alles probiert.
Danke schonmal,
Grüße,
Max aka v3rtico
Hier erstmal ein Screenshot der Seite:
Oben in den Registerkarten verschiebt sich der Text "Test" weiter nach unten, sogar aus dem DIV raus. Der Text sollte mit dem "Testlink" auf einer höhe liegen.
Hier der Quelltext der Seite:
<html>
<head>
<title>Testseite</title>
<link rel="stylesheet" type="text/css" href="styles/style.css">
</head>
<body bgcolor="FFE8D6">
<!-- Außenrand-->
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="middle">
<div class="outerdiv">
<img src="images/header.png">
<div align="center" class="naviyes"><p class="navi">Test</p></div><div align="center" class="navino"><a class="navi" href="index.html">Testlink</a></div><div class="navino" align="center"><p class="navi">Test</p></div><div align="center" class="navino"></div>
<div class="innerdiv">
<p>Testtesttest.<br></div>
</div>
</td></tr></table>
</body>
</html>
und hier das CSS:
div.outerdiv {
background-image: url(../images/png.png);
background-repeat:no-repeat;
background-position:center;
margin: 5em 5em 5em 5em;
padding-left:50px;
padding-right:170px;
width:730px;
height: 580px;
border:1px solid EE6C39;
margin: auto;}
div.navino {
float: left;
position: relative;
width:182px;
height:35px;
border-bottom:1px solid EE6C39;
border-top:1px transparent;
border-left:1px transparent;
border-right:1px transparent;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px}
div.naviyes {
float: left;
position: relative;
width:182px;
height:35px;
background-image: url(../images/white_t.png);
border-bottom:1px transparent;
border-top:1px solid EE6C39;
border-left:1px solid EE6C39;
border-right:1px solid EE6C39;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px}
div.innerdiv {
position: absolute;
font-family: Arial;
font-size: 13px;
background-image: url(../images/white_t.png);
width:628px;
height: 300px;
border-bottom:1px solid EE6C39;
border-left:1px solid EE6C39;
border-right:1px solid EE6C39;
border-top:0px transparent;
padding-left: 50px;
padding-right: 50px;
padding-top: 20px;
padding-bottom: 20px;
margin-top: 36px;}
p.navi {
font-family: Arial;
font-size: 20px;
color: #EE6C39;}
a.navi:hover {
font-family: Arial;
font-size: 20px;
color: #EE6C39;
text-decoration: none;}
a.navi:visited {
font-family: Arial;
font-size: 20px;
color: #F9A870;
text-decoration: none;}
a.navi:link {
font-family: Arial;
font-size: 20px;
color: #F9A870;
text-decoration: none;}
Kann mir da jemand helfen? Ich hab schon alles probiert.
Danke schonmal,
Grüße,
Max aka v3rtico
Bitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 102145
Url: https://administrator.de/contentid/102145
Ausgedruckt am: 25.11.2024 um 19:11 Uhr
2 Kommentare
Neuester Kommentar
<div align="center" class="navino">
<p class="navi"><a class="navi" href="index.html">Testlink</a></p>
</div>
hat bei mir im firefox funktioniert...
wenn ich mich recht erinnere gab es da irgendeine einschränkung, was im <div> verschaltet werden darf... oder so ähnlich...
vielleicht hilft es ja weiter...
gruss, mike
<p class="navi"><a class="navi" href="index.html">Testlink</a></p>
</div>
hat bei mir im firefox funktioniert...
wenn ich mich recht erinnere gab es da irgendeine einschränkung, was im <div> verschaltet werden darf... oder so ähnlich...
vielleicht hilft es ja weiter...
gruss, mike