min-height und Hintergrundprobleme

modern-props · #1 (**permalink**) 01.07.2009, 16:40

Hallo,

ich sowie mehrere meiner "Verbündeten" zum Kampf mit CSS finden nicht heraus, warum es so ist wie es ist. Und zwar habe ich eine .main-Klasse in der u.a. eine minimale Höhe und eine Hintergrundfarbe und v.a. -grafik angegeben wurde. Klappt gut, so lange es unter minimalen Höhe ist. Unter Leistungen - MODERN-PROPS - Impulse und Kommunikation ist das aber dann nicht mehr der Fall. Und schon werden weder Farbe noch Bild in den Hintergrund unterhalb der 600er-min-Marke angezeigt.

Weiß hier jemand Rat? Ausschnitte aus dem Dokument und dem zugehörigen CSS anbei oder unter Leistungen - MODERN-PROPS - Impulse und Kommunikation einzusehen.

Die entsprechenden CSS-Klassen

Code:

.main {
	background-color: #019ee1;
	background-image: url(grafiken/hintergrund.jpg);
	background-position: top center;
	background-repeat: repeat-y;
	color: white;
	direction: ltr;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: 28px;
	margin-left: auto;
	margin-right: auto;
	min-height: 600px;
	padding: 0px;
	position: relative;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	top: 0px;
	width: 868px;
}

.inhalte {
	left: 188px;
	position: absolute;
	top: 180px;
	width: 457px;
}

HTML bzw PHP-Dokument

HTML-Code:

<div class="main">

<div class="logo"><a href="http://www.modern-props.de"><img src="grafiken/logo.jpg" title="Logo - Zur Startseite" alt="Logo - Zur Startseite" border="0" width="149" height="89"></a></div>

<div class="bgtropfen"></div>

<div class="navibox">
	<ul>
<a href="?seite=start">STARTSEITE</a><br>

<a href="?seite=vorstellung">VORSTELLUNG</a><br>

<a href="?seite=leistungen">LEISTUNGEN</a><br>

<a href="?seite=seminare">SEMINARE</a><br>
<a href=?seite=kommunikation>kommunikation</a><br><a href=?seite=medienkompetenz>medienkompetenz</a><br><a href=?seite=rethorik>rethorik</a><br><a href=?seite=seminarstimmen>stimmen</a><br>
<a href="?seite=service">SERVICE-LOGIN</a><br>

<a href="?seite=kontakt">KONTAKT</a><br>
</ul></div> <!--schlieÃŸen der navibox-->

<div class="headline">
	STIMMEN ZU SEMINAREN	
</div> <!--schlieÃŸen der Ãœberschriften-klasse-->

<div class="inhalte">
	Einige Auftraggeber und Teilnehmer meiner Seminare haben zugestimmt, dass deren Feedback an dieser Stelle ver&ouml;ffentlich werden darf.
<br><br>
JOHANN FR&Ouml;HLING - Bildungswerk der Hanns-Seidel-Stiftung e.V.:<br>
<i>Herr Staendecke ...</i>

<br><br>

ARNOLD LINDNER - BLSV e.V. (Bezirk Oberpfalz):<br>
<i><img src=photos/stimme-lindner.png align=left width=90 height=125 border=0 alt="Portrait von Arnold Lindner">Fachkompetenz und...</i>
<br><br>
ANONYMER TEILNEHMER (14 Jahre):<br>
<i><img src=photos/stimme-junge.png align=left width=90 height=125 border=0 alt="Portrait eines Jungen - Symbolfoto"> COOOOOOOOOOOOOOOOOOLE Sache!!!!!!...</i><br>
Der Name wurde zum Schutz der MinderjÃ¤hrigen anonymisiert. Das Bild ist ein Symbolphoto.</div> <!--Ende der Inhalte-Klasse-->

<div class="buttons">
	<a href="javascript:window.print()">
seite drucken&nbsp;&nbsp;
<img src="grafiken/button-printer.gif" alt="drucken-Button" width="10" height="10" border="0">
</a><br>
<a href="javascript:window.external.addFavorite(location.href, 'MODERN PROPS')">
lesezeichen&nbsp;&nbsp;
<img src="grafiken/button-lesezeichen.gif" alt="lesezeichen-Button" width="10" height="10" border="0">
</a><br>
<a href="mailto:sebastian.staendecke@modern-props.de">e-mail schreiben&nbsp;&nbsp;
<img src="grafiken/button-email.gif" alt="e-mail-Button" width="10" height="10" border="0">
</a></div> <!-- Ende der Button-Box-->

<!--Rechte spalte start-->
<div class="rechtespalte">
	<img src=photos/seminarstimmen.png alt=Photo border=0></div>
<!--Rechte spalte endet hier-->


</div> <!--schließen der main-klasse-->

Vielen Dank für eure Hilfe!
Sebastian Staendecke

heiko_rs · #2 (**permalink**) 01.07.2009, 16:50

Das Problem ist pos. abs. (hat z.B. .inhalte) - diese Elemente haben keinerlei Einfluss auf benachbarte oder übergeordnete. Arbeite stattdessen mit float & clear (siehe FAQ).

Praktikant · #3 (**permalink**) 01.07.2009, 16:53

Ich denke, dass dir die absolute Positionierung "das genick bricht". Schonmal was von floats gehört?

Aber vorsicht. Wer floatet muss auch clearen

Edit: Heiko war schneller weil ich den Punkt in der FAQ nicht gefunden habe

modern-props · #4 (**permalink**) 01.07.2009, 21:56

Zitat:

Zitat von heiko_rs

Das Problem ist pos. abs. (hat z.B. .inhalte) (siehe FAQ).

zwar verstehe ich die kürzel pos. abs. nicht aber ich danke dir für den hinweis auf die floatsache und werde mich damit befassen!

Praktikant · #5 (**permalink**) 01.07.2009, 22:12

Zitat:

Zitat von modern-props

zwar verstehe ich die kürzel pos. abs. nicht aber ich danke dir für den hinweis auf die floatsache und werde mich damit befassen!

pos. abs = Position:absolute;

Ist so ne total nutzlose und absolut überbewertete CSS-Eigenschaft, die auch du gerne verwendest.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Brauche Hilfe: Schwarzes Nichts	Zwox	CSS	10	19.11.2010 17:53
Darstellungsprobleme im IE	lea11011989	CSS	17	05.11.2010 10:44
Div Positionen in Firefox falsch	ozero	CSS	4	17.07.2009 23:35
prblemme mit mein inhalt div	carlos587261	CSS	3	23.04.2008 15:07
Mozilla zeigt DIV zu oft an	cracki	CSS	6	09.03.2008 16:22