Iskue
Mitglied
hey ihr lieben....
ich hab da mal was runtergecodet was gestern auch noch einwandfrei lief........aufeinmal sind jetzt nur noch 2 navi punkte sichtbar und laut den quellcode im browser auch nur vorhanden....aber mein original quellcode erzählt mir was anderes ;-) ich seh grad einfach den fehler nicht...vielleicht ihr???
Falls noch Interessant mein css code dazu ;-)
ich hab da mal was runtergecodet was gestern auch noch einwandfrei lief........aufeinmal sind jetzt nur noch 2 navi punkte sichtbar und laut den quellcode im browser auch nur vorhanden....aber mein original quellcode erzählt mir was anderes ;-) ich seh grad einfach den fehler nicht...vielleicht ihr???
HTML:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css">
</head>
<body>
<article class="suchbox">
<section id="wohnen">
<h2><a href="#wohnen">Wohnen</a></h2>
<div class="inhalt">
<h3>Immobilien - Häuser, Wohnungen & Zimmer</h3>
<p>Immonet - Wohnungen, Häuser, Hausbau - Fertig- & Massivhäuser und noch viel mehr </p>
<form name="suche" action="<?php $_SERVER['SCRIPT_NAME']; ?>" method="POST">
<div id="wohnort">
<input class="input" type="text" size=20 name="ort" placeholder="PLZ, Stadtteil,...">
</div>
<div id="wohnart">
<select class="input" size=1 name="wohnart">
<option value="1">Wohnung mieten</option>
<option value="2">Wohnung kaufen</option>
<option value="3">Haus mieten</option>
<option value="4">Haus kaufen</option>
<option value="5">Grundstück kaufen</option>
</select>
</div>
<input class="button" type="submit" name="submit" value="Suche">
<div class="clearfix"></div>
<div id="preis">
<input class="input" type="text" size=10 name="preis" placeholder="Preis (€):">
</div>
<div id="groesse">
<input class="input" type="text" size=10 name="groesse" placeholder="Größe (m²):">
</div>
<div id="zimmer">
<input class="input" type="text" size=10 name="zimmer" placeholder="Zimmer:">
</div>
<br />
</form>
</div>
<br>
<br>
</section>
<section id="gewerbe">
<h2><a href="#gewerbe">Gewerbe</a></h2>
<div class="inhalt">
<h3>Gewerbe-Immobilien von Büro bis Praxis</h3>
<p>Grundstück, Lager oder Restaurant - alles für Ihr Gewerbe </p>
<form name="suche" action="<?php $_SERVER['SCRIPT_NAME']; ?>" method="POST">
<div id="wohnort">
<input class="input" type="text" size="20" name="ort" placeholder="PLZ, Stadtteil,...">
</div>
<div id="wohnart">
<select class="input" size=1 name="wohnart">
<option value="1">Büro/Praxis</option>
<option value="2">Grundstücke</option>
<option value="3">Hotel/Gastgewerbe</option>
<option value="4">Laden/Einzelhandel</option>
<option value="5">Halle/Lager/Produktion</option>
</select>
</div>
<input class="button" type="submit" name="submit" value="Suche">
<div class="clearfix"></div>
<div id="preis">
<input class="input" type="text" size=10 name="preis" placeholder="Preis (€):">
</div>
<div id="groesse">
<input class="input" type="text" size=10 name="groesse" placeholder="Größe (m²):">
</div>
<br />
</form>
</div>
<br>
<br>
</section>
<section id="umzug">
<h2><a href="#umzug">Umzug</a></h2>
<div class="inhalt">
<h3>Umziehen leicht gemacht - Der beste Service für Ihren Umzug</h3>
<p>Erhalten Sie Angebote von qualitätsgeprüften Unternehmen.</p>
<form name="suche" action="<?php $_SERVER['SCRIPT_NAME']; ?>" method="POST">
<div class="umzug_wrapper">
<h3>Umzug von</h3>
<div id="wohnort">
<input class="input" type="text" size=20 name="ort" placeholder="Straße, Hausnummer">
</div>
<div class="clearfix"></div>
<div id="preis">
<input class="input" type="text" size=10 name="preis" placeholder="PLZ">
</div>
<div id="groesse">
<input class="input" type="text" size=10 name="groesse" placeholder="Ort">
</div>
</div>
<div class="umzug_wrapper">
<h3>Umzug nach</h3>
<div id="wohnort">
<input class="input" type="text" size=20 name="ort" placeholder="Straße, Hausnummer">
</div>
<div class="clearfix"></div>
<div id="preis">
<input class="input" type="text" size=10 name="preis" placeholder="PLZ">
</div>
<div id="groesse">
<input class="input" type="text" size=10 name="groesse" placeholder="Ort">
</div>
</div>
<input class="button" type="submit" name="submit" value="Suche" style="position:relative; top:87px; right:1px;">
</form>
</div>
</div>
<br>
<br>
</section>
<section id="login">
<h2><a href="#login">Login</a></h2>
<div class="inhalt">
<h3>Login</h3>
<p>Noch nicht dabei? Dann schnell <a href="#regi">Registrieren</a></p>
<form action="?login=1" method="post">
<div id="login">
E-Mail:
<br>
<input class="input" type="email" size="40" maxlength="250" name="email">
<br> Dein Passwort:
<br>
<input class="input" type="password" size="40" maxlength="250" name="passwort">
<br>
</div>
<input class="button" type="submit" value="Anmelden" style="position:relative; top:22px; right:-40px;">
</form>
</div>
</section>
<section id="regi">
<h2><a href="#regi">Registratur</a></h2>
<div class="inhalt">
<form action="?register=1" method="post">
<div style="float:left;">
<p style="margin:10px 0 0 0;">Vorname:</p>
<input class="input" type="text" size="40" maxlength="250" name="vorname">
<p style="margin:10px 0 0 0;">Nachame:</p>
<input class="input" type="text" size="40" maxlength="250" name="nachname">
<p style="margin:10px 0 0 0;">E-Mail:</p>
<input class="input" type="email" size="40" maxlength="250" name="email">
</div>
<div class="clearfix"></div>
<div style="float:right; position:relative; bottom:193px; margin:0 10px 0 0;">
<p style="margin:10px 0 0 0;">Dein Passwort:</p>
<input class="input" type="password" size="40" maxlength="250" name="passwort">
<p style="margin:10px 0 0 0;">Passwort wiederholen:</p>
<input class="input" type="password" size="40" maxlength="250" name="passwort2">
<br>
<input class="button" type="submit" value="Abschicken" style="margin-top:25px;">
</div>
</form>
</div>
</div>
</section>
</article>
</body>
</html>
Code:
.suchbox section {
position: absolute;
display: block;
width: 700px;
height: 230px;
top: 100px;
background-color: #FAFAFA;
border: 1px solid #D3D3D3;
font-size: 1rem;
left: 25%;
}
.suchbox section h2 {
position: absolute;
left: 0;
top: -30px;
width: 124px;
height: 29px;
font-family: Verdana;
font-size: 15px;
margin: 0;
background-color: #D8D8D8;
border-radius: 4px 4px 0 0;
border: 1px solid #A4A4A4;
border-width: 1px 1px 0 0;
z-index: 1;
}
.suchbox section:nth-child(2) h2 {
left: 120px;
z-index: 0;
}
.suchbox section:nth-child(3) h2 {
left: 240px;
z-index: -1;
}
.suchbox section:nth-child(4) h2 {
left: 360px;
z-index: -2;
}
.suchbox section:nth-child(5) h2 {
left: 480px;
z-index: -3;
}
.suchbox section h2 a {
display: block;
margin: 5px 0 0 0;
text-align: center;
text-decoration: none;
color: #000;
}
.suchbox section:target,
.suchbox section:target h2 {
color: #000;
background-color: #FAFAFA;
z-index: 1;
border: 1px solid #A4A4A4;
border-bottom: none;
}
.suchbox section:target h2 a {
color: #81BEF7;
}
.suchbox section h2 a:hover {
color: #81BEF7;
}