Navigation verschiebt Seiteninhalt

Navigation verschiebt Seiteninhalt

Beitragvon basti87 » 17.10.2011, 20:42

Hallo zusammen,

beschäftige mich momentan mit dem Aufbau einer Internetseite und habe mit hilfe eines Tuturial ein Navigationsmenü mit CSS erstellt. Das funktioniert auch soweit ganz gut, nur verschiebt sich der Inhalt der Seite sobald ich über einen Menüpunkt fahre und somit weitere Punkte nach unten geklappt werden. Bisher konnte ich noch keine Lösung für mein Problem finden. Ich hoffe mir kann wer weiterhelfen.

Vielen Dank


Hier noch der Code meiner CSS-Datei
Code: Alles auswählen
#menu {
  top: 15px;
  bottom: 30px;
  font-weight: normal;
  position: static;
  display: block;
  float: none;
}
.aussen {
  border-style: solid;
  border-width: 1px;
  margin: 0px;
  padding: 0px;
  display: block;
  width: 150px;
  float: left;
  text-align: center;
  height: 25px;
  overflow: hidden;
  font-size: 12px;
  font-family: Arial,Helvetica,sans-serif;
  font-style: normal;
  font-weight: normal;
  background-color: #ff60d7;
}
a.innen {
  border-style: solid;
  border-width: 1px;
  margin: 0px;
  padding: 4px 0px 0px;
  float: none;
  display: block;
  width: 150px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  text-decoration: none;
  font-weight: normal;
  background-color: #ffff00;
  height: 30px;
}
span.menutag {
  margin: 0px;
  padding: 0px;
  height: 25px;
  display: block;
  background-color: #ff0000;
  line-height: 25px;
}
.aussen:hover {
  height: auto;
}
a.innen:hover {
  font-family: Arial,Helvetica,sans-serif;
  color: #33cc00;
  background-color: #000000;
  clear: both;
}
basti87
neu hier
 
Beiträge: 4
Registriert: 17.10.2011, 20:36

Re: Navigation verschiebt Seiteninhalt

Beitragvon djheke » 18.10.2011, 07:10

Poste mal deinen kompletten Code ( HTML + CSS ). Danke.
Benutzeravatar
djheke
Stammuser
 
Beiträge: 233
Registriert: 15.11.2010, 22:45

Re: Navigation verschiebt Seiteninhalt

Beitragvon basti87 » 18.10.2011, 15:48

Die CSS Datei ist ja bereits oben, und hier der html code. Hoffe er ist nicht all zu schlimm^^ Wie gesagt mit hilfe eines Tuturial erstellt

Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><meta =""><title>Energiewerkstatt-Grainau Startseite</title><link rel="stylesheet" href="file:///D:/Sebastian/Desktop/test/style.css" type="text/css"></head>
<body><table style="text-align: left; margin-left: auto; margin-right: auto; height: 50%; width: 50%;" border="0" cellpadding="2" cellspacing="2"><tbody><tr><td style="height: 100%; width: 100%;"><div style="text-align: center; margin-left: 169px; width: 760px;"><img style="width: 702px; height: 175px;" alt="Energiewerkstatt Grainau" src="Bilder/logo_mit_schrift.gif"><br></div><br><div class="aussen"><a href="index.html"><span class="menutag">Startseite</span></a></div>
<div class="aussen"><a href="ueber_mich.html"><span class="menutag">Über
Mich</span></a></div>
<div class="aussen"><span class="menutag">Meine
Arbeit</span>
<a class="innen" href="#">Arbeit 1</a>
<a class="innen" href="#">Arbeit 2</a>
<a class="innen" href="#">Arbeit 3</a>
<a class="innen" href="#">Arbeit 4</a>
<a class="innen" href="#">Arbeit 5</a>
<a class="innen" href="#">Arbeit 6</a>
</div><div class="aussen"><span class="menutag">Kontakt/Terminvereinbarungen</span>
</div><div class="aussen"><span class="menutag">Anfahrt</span>
</div><div class="aussen"><span class="menutag">Kooperatitionspartner</span>
</div><br><br><div style="text-align: center;"><b style=""><span style="font-size: 14pt; font-family: &quot;MV Boli&quot;;"><br>Herzlich Willkommen<br>

in der Energiewerkstatt Grainau - Lebens-Energieberatung für alle Sinne<br>

<br>

</span></b>

<p class="MsoNormal" style="text-align: center;" align="center"><b style=""><span style="font-family: &quot;MV Boli&quot;;">Vitalcheck<o:p></o:p></span></b></p>



<p class="MsoNormal" style="text-align: center;" align="center"><b style=""><span style="font-family: &quot;MV Boli&quot;;">Neue Homöopathie nach Körbler<o:p></o:p></span></b></p>



<p class="MsoNormal" style="text-align: center;" align="center"><b style=""><span style="font-family: &quot;MV Boli&quot;;">Reiki<o:p></o:p></span></b></p>



<b style=""><span style="font-size: 12pt; font-family: &quot;MV Boli&quot;;">Aroma-Beratung<br>

<br>

Energetische Wegbegleitung<br>
<br>
<br>
</span></b>

<p class="MsoNormal" style="text-align: center;" align="center"><i style=""><span style="font-size: 10pt; font-family: &quot;MV Boli&quot;;">Bitte beachten
Sie, dass es sich bei allen von mir durchgeführten Beratungen und Tätigkeiten
um <b style=""><u>KEINE</u></b> ärztlichen Maßnahmen
handelt! Es werden keine Diagnosen gestellt!<o:p></o:p></span></i></p>



<b style=""><span style="font-size: 14pt; font-family: &quot;MV Boli&quot;;">

</span></b></div><br><br><br><br><br><br><br><br><br><br><br><br></td></tr></tbody></table><br></body></html>
basti87
neu hier
 
Beiträge: 4
Registriert: 17.10.2011, 20:36

Re: Navigation verschiebt Seiteninhalt

Beitragvon djheke » 18.10.2011, 16:23

Also, was für ein Tutorial war es denn ??
Ich würde dir empfehlen ein anders Tutorial zu suchen. Dieses hier ist zwar sehr umfangreich aber es lohnt sich http://de.selfhtml.org/
Benutzeravatar
djheke
Stammuser
 
Beiträge: 233
Registriert: 15.11.2010, 22:45

Re: Navigation verschiebt Seiteninhalt

Beitragvon basti87 » 18.10.2011, 17:42

Ja mit selfhtml hab ich auch schon gearbeitet. Bin aber leider nur sehr sehr schleppend voran gekommen. Bin dann auf dieses Video dann gestoßen

Ok ich darf keine URLs posten^^ Gib bei Youtube einfach "CSS Menü Pulldown Tutorial" ein, dann sollte es gleich als erstes erscheinen. Das ist von einem BertholdLausch

Ist es denn so schlimm? Woran kann es denn liegen dass sich der text verschiebt?
basti87
neu hier
 
Beiträge: 4
Registriert: 17.10.2011, 20:36

Re: Navigation verschiebt Seiteninhalt

Beitragvon basti87 » 18.10.2011, 21:29

Hier nochmal der Code rein von der Navigationsleiste. Ohne Tabelle, Bilder oder Text

Code: Alles auswählen
<body>
   <br>
       <div align="center"></div>
<div class="aussen"><span class="menutag">Startseite</span></div>
      <div class="aussen"><span class="menutag">Über Mich</span></div>
<div class="aussen"><span class="menutag">Meine Arbeit</span>
  <a class="innen" href="#">Neue Homöopathie</a>
  <a class="innen" href="#">Reiki</a>
  <a class="innen" href="#">Vitalcheck</a>
  <a class="innen" href="#">Energetische Wegbegleitung</a>
  <a class="innen" href="#">Kloster-Bürstenmassage</a>
  <a class="innen" href="#">Aroma-Massage</a>
</div><div class="aussen"><span class="menutag">Kontakt/Terminvereinbarungen</span>
      </div><div class="aussen"><span class="menutag">Anfahrt</span>
      </div><div class="aussen"><span class="menutag">Kooperatitionspartner</span>
      </div>
</body>
basti87
neu hier
 
Beiträge: 4
Registriert: 17.10.2011, 20:36


Moderatoren: Laus, Moderatoren

Ähnliche Beiträge zu "Navigation verschiebt Seiteninhalt"

Zurück zu: CSS für Anfänger

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 5 Gäste