• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Ein riesen Problem mit Divs .. :D

Status
Für weitere Antworten geschlossen.

ganter123

Neues Mitglied
Hallo zusammen

Bei meinem Problem geht es um eine Website, die ich via HTML/CSS erstellen wollte.

Ist-Zustand

- Layout und die Navigation wurde konfiguriert
- Die einzelnen Unterseiten wurden erstellt

Datei Upload, Bilder hochladen, Datei Hosting auf Materialordner.de





Soll-Zustand
- Der Body und der Seiten_Body müssen angepasst werden.

Datei Upload, Bilder hochladen, Datei Hosting auf Materialordner.de






Hier ist noch der Source-Code: (Bitte beschränkt euch auf das wessentliche und nicht auf das sonstiges, ich weiss selber das man Teil Dinge einiges besser machen könnte :D)

CSS:

HTML:
* { margin: 0; padding: 0; }
body {
 
 background-color: #ffcc99;                
 margin-top: 0.5cm;
 margin-right: 3cm;
 margin-left: 3cm;
 
}
#Titelleiste {
 
 
 border: 0px solid black;
 
 
}
#Navigation {
 
 
 
 
 margin-top: 0.5cm;
 margin-bottom:0.5cm;
 float: left
 
 
}
#Body {
 
 height: 22cm;
 width: 27.2cm;
 
 
 margin-right: 0.5cm;
 float: top;
 
 
}
#Body_Seite {
 
 border: 0px solid black;
 margin-bottom: 0.5cm;
 
 
 float: right;
 
}
 
 
a {
 border: none;
 outline: none;
}
 
img {
border: none;
 
}
 
#Navigation li {
 float: left;
}
 
ul {
list-style: none;
}
li {
 list-style: none;
}
* { margin: 0; padding: 0; }
body2 {
 background:url(Schriftrolle.gif) no-repeat;
}
h1{
 font-family: Felix Titling, Times, serif;
 font-size: 18pt;
 
}
h4{
 font-family: Felix Titling, Times, serif;
 font-size: 11pt;
}
a.Kontakt{
   background: url("Bilder/button3.gif") no-repeat; 
   display: block;
   width:   210px; 
   height:  33px;  
 
}
a.Kontakt:hover {
 
 background: url("Bilder/button3_hover.gif") no-repeat; 
 
}
a.Kontakt img {
 visibility: hidden;
 display: none;
 
 
}
a.Homepage{
   background: url("Bilder/button1.gif") no-repeat; 
   display: block;
   width:   210px; 
   height:  33px;     
 
}
a.Homepage:hover {
 
 background: url("Bilder/button1_hover.gif") no-repeat; 
 
}
a.Homepage img {
 visibility: hidden;
 display: none;
 
 
}
a.Aegypten{
   background: url("Bilder/button2.gif") no-repeat; 
   display: block;
   width:  210px; 
   height:  33px;     
 
}
a.Aegypten:hover {
 
 background: url("Bilder/button2_hover.gif") no-repeat; 
 
}
a.Aegypten img {
 visibility: hidden;
 display: none;   
 
}
a.Gästebuch{
   background: url("Bilder/button4.gif") no-repeat; 
   display: block;
   width:   210px; 
   height:  33px;     
 
}
a.Gästebuch:hover {
 
 background: url("Bilder/button4_hover.gif") no-repeat; 
 
}
a.Gästebuch img {
 visibility: hidden;
 display: none;
 
 
}
a.Links{
   background: url("Bilder/button5.gif") no-repeat; 
   display: block;
   width:   183px; 
   height:  33px;  
 
}
a.Links:hover {
 
 background: url("Bilder/button5_hover.gif") no-repeat; 
 
}
a.Links img {
 visibility: hidden;
 display: none;
 
 
}
button {
 border: none;
}
#input1 {
 
}
#Fotogalerie_Bilder {
   display: block;
   margin: 0 auto;
}
#Aegypten_Navigation1{
 float:left;
 margin-right: 0.4cm;
 margin-left:1.6cm;
 
 
}
 
#Aegypten_Navigation2{
 float:left;
 margin-right: 0.4cm;
 
}
 
#Aegypten_Navigation3{
 float:left;
 
}
 
a.Navigation1{
   background: url("Bilder/Buttons_Navi2_03.gif") no-repeat; 
   display: block;
   width:   150px; 
   height:  29px;  
 
}
a.Navigation1:hover {
 
 background: url("Bilder/Buttons_Navi2_hover_03.gif") no-repeat; 
 
}
a.Navigation1 img {
 visibility: hidden;
 display: none;
 
}
 
 
a.Navigation2{
   background: url("Bilder/Buttons_Navi2_05.gif") no-repeat; 
   display: block;
   width:   150px; 
   height:  29px;  
 
}
a.Navigation2:hover {
 
 background: url("Bilder/Buttons_Navi2_hover_05.gif") no-repeat; 
 
}
a.Navigation2 img {
 visibility: hidden;
 display: none;
 
}
 
a.Navigation3{
   background: url("Bilder/Buttons_Navi2_07.gif") no-repeat; 
   display: block;
   width:   150px; 
   height:  29px;  
 
}
a.Navigation3:hover {
 
 background: url("Bilder/Buttons_Navi2_hover_07.gif") no-repeat; 
 
}
a.Navigation3 img {
 visibility: hidden;
 display: none;
 
}
#Body_Informationen {
 float:left;
 margin-top: 0.5cm;
 margin-right: 0.5cm;
 margin-bottom: 0.5cm;
}
#Kontaktformular {
 width: 27.2 cm;
 hight: 22cm;
 float:left;
 
}
 
#Fusszeile {
 
 
 border: 0px solid black;
 
 
 margin-top: 0.5cm;
 float: bottom;
 
}


HTML:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title>Home</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
 <body>
 
  <div id="Titelleiste"><img src="Bilder/titel.gif" width="1024" height="94" alt="Aegypten"></div>
  <div>
  <ul id="Navigation">
  <li><a href="Homepage.html" class="Homepage"><img src="Bilder/button1.gif" width="205" height="33" alt="Home"></a></li>
  <li><a href="Aegypten.html" class="Aegypten"><img src="Bilder/button2.gif" width="205" height="33" alt="Aegypten"></a></li>
  <li><a href="Kontakt.html" class="Kontakt"><img src="Bilder/button3.gif" width="205" height="33" alt="Kontakt"></a></li>
  <li><a href="Gästebuch.html" class="Gästebuch"><img src="Bilder/button4.gif" width="205" height="33" alt="Gästebuch"></a></li>
  <li><a href="Links.html" class="Links"><img src="Bilder/button5.gif" width="205" height="33" alt="Links"></a></li>
  </ul>
  </div>
 
  <div id="Body">
  <div><ul><li id="Aegypten_Navigation1"><a href="Informationen.html" class="Navigation1"><img src="Bilder/Buttons_Navi2_03.gif" width="150" height="29" alt="Informationen"><a/></li>
    <li id="Aegypten_Navigation2"><a href="Fotogalerie.html" class="Navigation2"><img src="Bilder/Buttons_Navi2_05.gif" width="150" height="29" alt="Fotogalerie"><a/></li>
      <li id="Aegypten_Navigation3"><a href="Sharmelsheik.html" class="Navigation3"><img src="Bilder/Buttons_Navi2_07.gif" width="150" height="29" alt="Sharmelsheik"><a/></li>  
  </div>
 
 
 
 
  <div id="Body_Seite"><img src="Bilder/body_Seite.gif"width="197" height="833" alt="Sonnenuntergang"></div>
 
 
  <div id="Fusszeile"><img src="Bilder/fusszeile.gif" width="1032" height="100" alt=""></div>
 
 
 </body>
</html>

Ich wäre euch sehr dankbar wenn ihr mir helfen könntet, da ich nun seit ca 7 Tagen nur noch an diesem Problem arbeite ... :(

Danke schon im voraus

Gruss

Ganter123
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben