mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 18.04.2024 07:42 Benutzername: Passwort: Auto-Login

Thema: Div am unteren Rand vom 29.08.2006


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Div am unteren Rand
Autor Nachricht
die.anna
Threadersteller

Dabei seit: 02.08.2005
Ort: Kiel
Alter: 40
Geschlecht: Weiblich
Verfasst Di 29.08.2006 13:28
Titel

Div am unteren Rand

Antworten mit Zitat Zum Seitenanfang

Hallo alle zusammen,
ich habe folgendes Problem. Ich möchte einen grünen Balken an den unteren Rand meiner Site platzieren.
Meine ganze Struktur ist über Divs aufgebaut so also auch der Balken. Seine Position soll nicht absolute sein, aber dann lässt er immer so ca. 80px Platz zwischen sich und dem Ende der Site.
Ich hab jetzt schon ziemlich viel rum probiert und leider auch nichts in der Suche gefunden.

Code:
<body>
<div id="head">
   <div id="bildreihe"></div>
   <div id="menue">
      <a href="index.html">Accueil&nbsp;</a>
      <a href="philosophie.html">Philosophie&nbsp;</a>
      <a href="references.html">R&eacute;f&eacute;rences&nbsp;</a>
      <a href="service.html">Service&nbsp;</a>
      <a href="historique.html">Historique&nbsp;</a>
      <a href="contact.html">Contact</a>
   </div>
   <div id="logo"></div>
</div>

<div id="inhalt">
   <div id="sublink">
      <a href="#">Historique</a>
      <img src="images/linie.gif" />   
      <a href="sub/bureau.html">Bureau&nbsp;d&rsquo;&eacute;tudes Jesaitis</a>
      <img src="images/linie.gif" />
   </div>
   <div id="scroll">
      <div id="content">
      <h1>"Le "bureau d&apos; &eacute;tudes Jesaitis" est devenu la "soci&eacute;t&eacute; 4WIND GmbH"
             <img src="images/kaesten_klein.gif" alt="kasten" />
       </h1>
         
  <p>En novembre 2002 le bureau d&apos; &eacute;tude Jesaitis a chang&eacute; sa d&eacute;nomination et est devenu la soci&eacute;t&eacute; 4WIND GmbH.
L&apos; activit&eacute; de 4WIND GmbH est encore la planification et le d&eacute;veloppement des &eacute;oliennes en Allemagne et à l&apos; &eacute;tranger et le personnel du bureau n&apos; a pas chang&eacute;.</p>

<p>Les collaborateurs de la soci&eacute;t&eacute; 4WIND GmbH sont Dirk Jesaitis, g&eacute;rant, l&apos; ing&eacute;nieur diplôm&eacute; Andrej Rybakowski, responsable des proc&eacute;dures d&apos; autorisation et les calculs de nuisances, le g&eacute;ographe diplôm&eacute; Rolf Ohlsen, responsable de l’&eacute;laboration des contrats et la garantie des sites d&apos; &eacute;oliennes, l&apos; architecte Knud Baßin, qui dirige la filiale du bureau à Hambourg,  l&apos; agent technico-commercial Andrea Langholz, responsable de la comptabilit&eacute; et l&apos; administration.  En plus la soci&eacute;t&eacute; 4WIND GmbH fait appelle aux services d’un &eacute;tudiant et d’un stagiaire.</p>
      </div>
   </div>
</div>
<div id="bottom">
   <div id="balken_unten"></div>
   <div id="balken_hell"> <a href="#">Mentions&nbsp;l&eacute;gales</a>&nbsp;<a href="#">Mail</a></div>
</div>


Hiermal mein Aufbau und dann noch das CSS

Code:
#sublink { color: #297e62;
         font: 10px/14px Verdana, Arial, Helvetica, sans-serif;
         text-decoration: none;
         background-image: url(../images/verlauf.jpg);
         background-repeat: no-repeat;
         visibility: visible;
         height: 371px;
         width: 145px;
         float:left;
         background-position: 5px 5px;
         background-color: #ffffff;
         padding-left: 5px;
}
#kaesten_oben {
   background-image: url(../images/kaesten.gif);
   background-repeat: no-repeat;
   height: 21px;
   width: 74px;
   border-top-style: none;
   border-right-style: none;
   border-bottom-style: none;
   border-left-style: none;
   position: absolute;
   top: 100px;
   right: 5px;
}
#bildreihe {
   background-image: url(../images/bildreihe.jpg);
   background-repeat: no-repeat;
   height: 100px;
   width: 150px;
   visibility: visible;
   margin-top: 0px;
   margin-left: 0px;
   background-color: #FFFFFF;
   background-position: 5px 5px;
   float: left;
}
body {
   margin: 0 0 0;
   padding: 0;
   background-image: url(../images/oben_bg.gif);
   background-repeat: repeat-x;
}
#menue {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   font-style: normal;
   line-height: 14px;
   font-weight: normal;
   font-variant: normal;
   color: #b5c6ba;
   text-decoration: none;
   margin-left: 5px;
   float: left;
   position: absolute;
   top: 78px;
   left: 150px;
}
#kaesten_unten {
       background-image: url(../images/kaesten.gif);
       background-repeat: no-repeat;
       height: 21px; width: 74px;
       visibility: visible;
       float: right;
       margin-bottom: 0;
}
#balken_unten {
   background-color: #297e62;
   background-repeat: no-repeat;
   height: 21px;
   width: 70%;
   visibility: visible;
   float: left;
   clear: none;
   margin-bottom:0;
   margin-left: 0;
}
#balken_hell {
   color: #297e62;
   font: 10px/14px Verdana, Arial, Helvetica, sans-serif;
   text-decoration: none;
   background-color: #b5c6ba;
   height: 20px;
   width: 20%;
   border-right-style: none;
   border-bottom-style: none;
   visibility: visible;
   float: right;
   margin-bottom: 0;
   border-top: 1px solid #297e62;
   border-left: 1px solid #297e62;
}
#balken_hell a {
   display: inline;
   background-image: url(../images/kreuz_gruen.gif);
   background-repeat: no-repeat;
   width: 50px;
   background-position: left;
   list-style-image: none;
   list-style-type: none;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   line-height: 14px;
   color: #297E62;
   text-decoration: none;
   padding-left: 15px;
   margin-left: 15px;
}
#balken_hell a:hover {
   background-image: url(../images/kreuz_orange.gif);

}
#sublink a {
   display: block;
   background-image: url(../images/kreuz_gruen.gif);
   background-repeat: no-repeat;
   width: 50px;
   background-position: left 4px;
   list-style-image: none;
   list-style-type: none;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #297E62;
   text-decoration: none;
   padding-left: 13px;
   margin-top: 15px;
   margin-left: 10px;   
}
#sublink a:hover {
   display: block;
   background-image: url(../images/kreuz_orange.gif);
   background-repeat: no-repeat;
   width: 50px;
   background-position: left 4px;
   list-style-image: none;
   list-style-type: none;
}
#menue a {
   display: inline;
   background-image: url(../images/kreuz_gruen.gif);
   background-repeat: no-repeat;
   width: 50px;
   background-position: left;
   list-style-image: none;
   list-style-type: none;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   line-height: 14px;
   color: #B5C6BA;
   text-decoration: none;
   padding-left: 15px;
   margin-left: 10px;
}
#menue a:hover {
   background-image: url(../images/kreuz_orange.gif);
}

#scroll {
   visibility: visible;
   width: 70%;
   height: 350px;
   overflow: auto;
   background-image: url(../images/weiss.gif);
   background-repeat: repeat;
   float: left;
   margin-left: 40px;
   margin-top: 20px;
}
#content {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #000000;
   height: 90%;
   width: 90%;
   line-height: 18px;
}
h1 {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px;
   font-weight: bold;
   color: #297E62;
   text-decoration: none;
   margin-right: 5px;
}
h2 {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px;
   color: #297E62;
   background-image: url(../images/kaesten_klein.gif);
   background-repeat: no-repeat;
   background-position: left;
   font-weight: normal;
   padding-left: 45px;
   margin-top: 20px;
}
h3 {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px;
   color: #297E62;
   font-weight: normal;
   
}
#head {
   height: 100px;
   width: 100%;
   margin-top: 0px;
   margin-left: 0px;
}
#logo {
   background-repeat: no-repeat;
   background-image: url(../images/logo.gif);
   background-position: right top;
   float: right;
   height: 100px;
   width: 225px;
   margin-top: 10px;
   margin-right: 10px;
}
#inhalt {
   height: 90%;
   width: 95%;
   margin-top: 0px;
   margin-left: 0px;
   float: left;
   /*padding-bottom: 150px;*/
}
#bottom { bottom: 0;
       height: auto;
       width: 100%;
       float:left;
       margin-bottom: 1px;
       margin-left: 0;      
       padding-bottom: 1px;
      padding-left: 0;
      }

a {
   font-size: 10px;
   color: #297e62;
   text-decoration: none;   
}
a:hover {
   font-size: 10px;
   color: #297e62;
   text-decoration: underline;   
}


So ich hoffe ihr könnt euch da durchforsten und wisst eine Antwort auf mein Problem.

Danke schon mal im Voraus für eure Mühe Lächel
  View user's profile Private Nachricht senden
xane

Dabei seit: 05.01.2005
Ort: good old NBGizzle
Alter: 37
Geschlecht: Männlich
Verfasst Di 29.08.2006 13:58
Titel

Antworten mit Zitat Zum Seitenanfang

Stell mal n scribble online, dass den Aufbau deiner Seite zeigt, dann kann ich dir helfen, das Ganze von Grund auf zu verbessern.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
die.anna
Threadersteller

Dabei seit: 02.08.2005
Ort: Kiel
Alter: 40
Geschlecht: Weiblich
Verfasst Di 29.08.2006 14:19
Titel

Antworten mit Zitat Zum Seitenanfang

So.

  View user's profile Private Nachricht senden
tacker

Dabei seit: 22.03.2002
Ort: Trondheim, Norwegen
Alter: 43
Geschlecht: Männlich
Verfasst Di 29.08.2006 14:30
Titel

Antworten mit Zitat Zum Seitenanfang

Bitte edit verwenden.
Wichtig: HTML und CSS sind keine Programmiersprachen!
Verschoben von Programmierung nach Allgemeines - Nonprint.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
xane

Dabei seit: 05.01.2005
Ort: good old NBGizzle
Alter: 37
Geschlecht: Männlich
Verfasst Di 29.08.2006 15:24
Titel

Antworten mit Zitat Zum Seitenanfang

Okay, habs mir mal angeschaut. Hab jetzt leider nicht soviel Zeit, meld mich heut abend nochma.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen [css] Bild am unteren Rand des Bildschirms
Webseite am unteren Rand ausrichten?
Unteren Bildschirmrand entfernen
Text im div ausrichten - am unteren Rahmen
Footer am unteren Ende der Site
CSS: Position am unteren Seitenrand nur bei wenig Content
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.