XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   min-height und Hintergrundprobleme (http://xhtmlforum.de/showthread.php?t=57564)

modern-props 01.07.2009 16:40

min-height und Hintergrundprobleme
 
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 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 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 :D

modern-props 01.07.2009 21:56

Zitat:

Zitat von heiko_rs (Beitrag 437351)
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 01.07.2009 22:12

Zitat:

Zitat von modern-props (Beitrag 437411)
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.


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:31 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023