| Autor |
Nachricht |
waiu
Threadersteller
Dabei seit: 16.04.2002
Ort: -
Alter: -
Geschlecht: 
|
Verfasst Mo 27.06.2005 22:18
Titel [CSS/HTML Probs] Container und 100% Höhe |
  |
|
Hi an alle CSS-Füchse hier,
unter folgendem Link seht Ihr einen Sketch von mir: http://www.airfrenchband.org/sketch/
Mein Problem:
Ich möchte gerne den äußeren blauen Bereich auf 100% Höhe haben (also bis unten zum Browserrand) OHNE Scrollbalken. Momentan ist einer da, weil er anscheinend den oberen Abstand mit dazu rechnet. Wie umgehe ich das?
Der weiße innere Inhaltsbereich soll dann auch entsprechend bis unten laufen.
Ich poste dazu mal das CSS:
| Code: | body {
background : #FFFFFF repeat-x;
background-image: url(images/bg.jpg);
background-position: bottom;
font-family: Helvetica;
}
#main {
background: #197FBF;
width: 900px;
text-align: left;
margin: auto;
margin-top: 50px;
height: 100%;
}
div.logoair img {
margin: 0px;
padding: 0px;
position: relative;
left: 639px;
top: -89px
}
div.content {
width: 855px;
position: absolute;
top: 190px;
margin-left: 20px;
background-color: #fff;
padding-bottom: 20px;
}
div.tlk p {
margin-left: 24px;
padding-top: 20px;
}
div.tlk p a {
font-size: 18px;
font-weight: bold;
text-decoration: none;
color: #fff;
margin-right: 15px;
text-transform: uppercase;
}
div.tlk p a:link {
color: #fff;
padding: 3px;
}
div.tlk p a.active:link {
color: #000;
background-color: #fff;
padding: 3px;
}
div.tlk p a:hover {
color: #000;
}
div.content h1 {
position: absolute;
top: -67px;
margin-left: 0px;
background-color: #fff;
padding: 5px;
color: #197FBF;
display: inline;
font-size: 30px;
text-transform: uppercase;
}
div.content h2 {
color: black;
font-size: 12px;
margin: 30px 0 0 30px;
}
div.content h3 {
text-transform: uppercase;
color: #FF2E72;
font-size: 17px;
margin: 5px 0 1px 30px;
}
div.content p {
margin: 0 50px 0 30px;
font-size: 12px;
}
|
Vielen Dank für Eure Hilfe!
|
|
| |
  |
 |
mcbethy
Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 41
Geschlecht: 
|
Verfasst Mo 27.06.2005 22:45
Titel
|
|
|
| Code: | | html, body {height:100%} |
Ach so, und hast du es mit negativem margin-top versucht?
Zuletzt bearbeitet von mcbethy am Mo 27.06.2005 22:49, insgesamt 2-mal bearbeitet
|
|
| |
|
|
|
Anzeige
|
|
|
waiu
Threadersteller
Dabei seit: 16.04.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mo 27.06.2005 23:20
Titel
|
|
|
| mcbethy hat geschrieben: | | Code: | | html, body {height:100%} |
Ach so, und hast du es mit negativem margin-top versucht? |
body html height: 100% bringt nichts.
Ich soll dem blauen Bereich einen negativen margin-top geben? Hm ich probiers mal.
Das Problem ist scheinbar wirklich die beiden argumente hier gleichzeitg zu verwenden, eigentlich logisch. Nur was tun? : | Code: | margin-top: 50px;
height: 100%; |
Hab den Link mal upgedated.
Zuletzt bearbeitet von waiu am Mo 27.06.2005 23:25, insgesamt 3-mal bearbeitet
|
|
| |
|
|
way2hot
Dabei seit: 14.03.2004
Ort: Jüchen-Gierath
Alter: 41
Geschlecht:
|
|
| |
 |
|
mcbethy
Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 41
Geschlecht:
|
Verfasst Di 28.06.2005 01:21
Titel
|
|
|
Ha, ja richtig! Ich hatte selbst das Problemchen.
Oberes Beispiel hatte mir aber nichts genützt, weil der Seitenaufbau ein völlig anderer war.
Möglich wäre es natürlich einen Container (mit dem Blau) um alles herumzulegen, der die Höhe 100% und margin:0 hat. In diesem Container befände sich dann als Header ein weißer Div-Container mit weißer Hintergrundfarbe in dem das Logo ausgerichtet werden könnte. Aber vermutlich ist das zu kompliziert gedacht. Ist schon spät. 
Bei mir ging es wirklich als ich dem html- und/oder body-Element (genau weiß ich das jetzt nicht mehr) ein negatives margin-bottom zugewiesen habe.
In deinem Fall wären das margin-bottom:-50px. Ich frage mich gerade, ob das auch browserübergreifend kompatibel war... im FF und IE neuster Generationen auf dem PC schon.
Nun, probieren geht über studieren! 
|
|
| |
|
|
waiu
Threadersteller
Dabei seit: 16.04.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 28.06.2005 09:23
Titel
|
|
|
Hey,
| Code: | html {
height: 100%;
margin-bottom: -50px;
} |
hat geholfen! Merci!
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
css div container höhe?
[css] div-container Höhe
3 Divs nebeneinander im Container auf einer Höhe?
Problem mit div Container - höhe soll sich automatisch anpas
[HTML + PHP] Probs mit der Auswahl beim Dropdown Menü
HTML, Java, PHP? Tabellen - Zellen - Höhe
|
|
Willkommen auf dem Portal für Mediengestalter
