63130
Nov 19, 2008, updated at 09:26:05 (UTC)
3995
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
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
Share on Facebook
Share on Twitter
Share on Reddit
Share on LinkedinPlease also mark the comments that contributed to the solution of the article
Content-Key: 102145
Url: https://administrator.de/contentid/102145
Printed on: April 24, 2024 at 09:04 o'clock
2 Comments
Latest comment
<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
Ich hab mir jetzt einfach n workaround ausgedacht mit dem es klappt: Ich hab n Table in das div gesetzt mit valign="middle"
Danke trotzdem
Danke trotzdem
