[CSS] Layer soll dynamisch bleiben ist aber nicht möglich

[Payne_of_Death]

Hey,

vielleicht hat jemand gerade für dieses Problem einen Tipp parat.

Öffnet paraellel dazu am besten:
optische Darstellung

EDIT:

---

Das dritte News beim Link genau anschauen -> Rahmen.

---

Problem ist mein angehendes News System, aus Design technischer Sicht wurde u.A. ein Div Layer nach unten verschoben um nicht langweilig zu wirken.

Nun ist es aber so das der Bereich indem die News steht auf der einen Seite eine Mindesthöhe haben sollte um nicht zusammenzuklappen und auf der anderen sich der Textlänge anpassen sollte.

Die Related Links sind unendlich quasi daher soll sich das Div Element der Größe anpassen tut es ja auch nur mit dem Nebeneffekt das der Newstext wegen dem IE
-> den ich hasse
u.A. min-height nicht unterstützt und min-height von dem News Text in Abhängigkeit gesetzt ist.

kurz und bündig:
-> Newsinhalt Layer soll in Abhängigkeit zum Related Link Layer gesetzt werden und das Verhältnis beibehalten. Für eine relative Angabe habe ich keine Idee da beide Layer variabel sind.

verwendeter Browser Opera
IE benötigt zwingend height aber das ist böse

Der CSS Code:

/* News Bereich */
.NewsBody {
   margin: 0px 0px 0px 0px;
   width: 501px;
   background-color:#F9F1F3;
   border-top-width:1px;
   border-top-style:solid;
   border-top-color:#AFAFAF;
   background-color:#EBEBEB;
}

/* News Hilfsausrichtung */
.NewsBody_HeaderSupport {
   width: 501px;
   top: 0px;
   bottom:0px;
   padding:0px;
   margin:0px 0px 0px 0px; 
   position:relative;
}

/* News Titel Bereich */
.NewsBody_HeaderTitel {
   width:494px;
   height:20px;
   line-height:18px;
   padding-left:5px;
   border-left-width:1px;
   border-left-style:solid;
   border-left-color:#AFAFAF;
   border-right-width:1px;
   border-right-style:solid;
   border-right-color:#AFAFAF;
   background-image:url(design/dwh_style1/kasten_header.gif);
   color:#9E0B0E;
   font-size:7pt;
   font-family:Verdana;
   font-weight:bold;
}

/* News linker Teilbereich Ausrichtung: Picture, Related links*/
.NewsBody_support_imagerel {
  width:123px;
  border-left-width:1px;
  border-left-style:solid;
  border-left-color:#AFAFAF;
  float:left;
  background-color:#F9F1F3;
}

/* News Related Links */
.NewsBody_RelatedLinks {
   width: 123px;
   clear:both;
   padding-top:12px;
   min-height:65px;
   background-color:#F9F1F3;
   margin: 0px 0px 0px 0px;
   padding-bottom:0px;
   border-bottom-width:1px;
   border-bottom-style:solid;
   border-bottom-color:#AFAFAF;
}

/* News: written by.... */
.NewsBody_DataInfoLine {
   color:#3C3C3C;
   font-size:8pt;
   font-family:Verdana;
   position:relative;
   padding:0px;
   margin:0px 0px 0px 0px;
   width: 376px;
   float: right;
   background-color:#F9F1F3;
   border-right-width:1px;
   border-right-style:solid;
   border-right-color:#AFAFAF;
}

/* News Text */
.NewsBody_DataBody {
   font-size:8pt;
   font-family:Verdana;
   color:#000000;
   width: 374px;
   top: 0px;
   float:right;
   min-height:178px;
   height:178px;   
   margin: 0px 0px 0px 0px;
   border-left-width:2px;
   border-left-style:ridge;
   border-left-color:#AFAFAF;
   border-top-width:2px;
   border-top-style:ridge;
   border-top-color:#AFAFAF;
   border-right-width:1px;
   border-right-style:solid;
   border-right-color:#AFAFAF;
   background-color: #EBEBEB;
}

/* News Kommentar Zeile */
.NewsBody_CommentLine {
   color:#797777;
   font-size:7pt;
   font-family:Verdana;
   width: 369px;
   line-height:10px;
   padding-left:5px;
   padding-top:5px;
   float:right;
   background-image:url(design/dwh_style1/kasten_footer_g.gif);
   clear:both;
   margin: 0px 0px 0px 0px;
   border-left-width:2px;
   border-left-style:ridge;
   border-left-color:#AFAFAF;
   border-bottom-width:2px;
   border-bottom-style:ridge;
   border-bottom-color:#AFAFAF;
   border-right-width:1px;
   border-right-style:solid;
   border-right-color:#AFAFAF;
}

Die Anwendung:

<div class="NewsBody
  <div class="NewsBody_HeaderSupport">
     <div class="NewsBody_HeaderTitel">
       blubbbbb
     </div>
     <div class="NewsBody_support_imagerel">
       <img src="design/dwh_style1/news_logo.gif"
 width="100" height="100" alt="" hspace="2">
       <div class="NewsBody_RelatedLinks">
         <table width="120">
	  <tr>
            <td><img src="design/dwh_style1/kasten.gif" width="3" height="3" 
hspace="5" alt="Related
 Links">Related Links</td>
	  </tr>   
	  <tr>
            <td><img src="design/dwh_style1/pfeil.gif" width="3" height="5" hspace="15" alt="">
<a href="http://www.klein.de"
 target="_blank">klein2</a></td>
	 </tr>
       </table>
       </div>
    </div>
    <div class="NewsBody_DataInfoLine">
      <table>
        <tr>
          <td align="left"><img src="design/dwh_style1/kasten.gif" width="3" height="3" 
hspace="5" alt="">written by:<b> Debugging</b></td>
        </tr>
     </table>
  </div>
   <div class="NewsBody_DataBody">
  kidddddddiieeeeeee
   </div>
  <div class="NewsBody_CommentLine">
    <table border="0">
      <tr>
        <td align="left"><img src="design/dwh_style1/pfeil.gif" 
width="3" height="5" hspace="5" alt="">
</td>
	<td><a href="/page/index.php?site=f899139df5e1059396431415e770c6dd&amp;

action=c40bebce17f8c62e0db12316d9a16571&amp;news_lfdnr=2">Comments</a> (2)</td>
      </tr>
  </table>
  </div>
 </div>
</div>

EDIT:

---

linebreak sponsored by asp2php. Bitte demnächst selbst dafür sorgen.

---

[asp2php]

und du meinst, es guckt einer drüber

btw: so sieht im Firefox aus s. Anhang

[Payne_of_Death]

Original geschrieben von asp2php
und du meinst, es guckt einer drüber

btw: so sieht im Firefox aus s. Anhang

rechne eigentlich damit das mir jemand einen Tipp gibt
Also in meinem Firefox hats bisher noch nie so ausgesehen hmmmm.....

[asp2php]

Ähm ... da kann man echt schlecht drüber gucken. Meinst du den Fehler wie im Anhang (mit Opera 7.23) ?.
Du verschachtelst 'ne Menge <div>. Es wäre hilfreich wenn du bei </div> HTML-Kommentar einbaust, zu welchem <div> der schliessende Tag gehört. Ausserdem habe ich festgestellt, dass du 'ne Menge <p> ohne </p> hast. Und warum soviele Tabellen-Tags, wenn du dir schon die Mühe gibst, CSS zu verwenden? Und dann auch noch sowas:
- <table width="161" cellspacing="0">
- <td align="left">
- ...

BTW: der gepostete HTML-Code von dir stimmt nicht mit der von der Seite überein.

[asp2php]

hier ist Anhang

Ach ja, IMHO ist

/* News Text */
.NewsBody_DataBody {
   font-size:8pt;
   font-family:Verdana;
   color:#000000;
   width: 374px;
   top: 0px;
   float:right;
   min-height:178px;
   [color=red]height:178px;[/color]
   margin: 0px 0px 0px 0px;
   border-left-width:2px;
   border-left-style:ridge;
   border-left-color:#AFAFAF;
   border-top-width:2px;
   border-top-style:ridge;
   border-top-color:#AFAFAF;
   border-right-width:1px;
   border-right-style:solid;
   border-right-color:#AFAFAF;
   background-color: #EBEBEB;
}

daran schuld.

[MaxP0W3R]

also im firefox kannste den code bisher total knicken...

[Payne_of_Death]

@ASP:

das mit dem height ist mir klar....Der Witz ist das der IE dies unbedingt haben möchte so spackt der wirklich rum, d.h. er lässt es zusammenklappen.

Es war im übrigen noch ne Table drinnen mit der ich rumexperimentiert habe.

Ich glaube ich sollte die Box nochmals überarbeiten in Richtung 2 dynamischer Layer.

Ein anderer Weg sehe ich nicht mehr....