[CSS] wieder mal macht der IE Ärger

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [CSS] wieder mal macht der IE Ärger

    Hallo Gemeinde,

    es geht im folgenden um ein News-archiv, welches dynamisch aus einer DB generiert wird. Zu Anschaungszwecken hab ich mal einen
    Beitrag hardcodiert. In allen gängingen Browsern macht mir die
    darstellung keine Probleme, ausser der im titel angeführte IE. Hoffe
    jemand weiss rat!

    Code:
    <div class = "fullpost">
     <h3>Martin hängt schoner an den Nagel</h3>
    
     <div class = "dateline">
      Tue , 27th Feb 2007 11:02:27 AM by Timo Trallala
     </div>
    
     <div class = "news_text">
      <span class = "right"><img src = "img/userfiles/timo%20trallala/Image_1119648887.jpg" title = "Eule Und Turmwirt"
                                 alt = "">
    
      <p class = "subtitle">
      Eule und der Turmwirt im Huebis</p>
    
      </span>Seit Jahren begab sich dasselbe Spiel: 'Ich brauch das nicht mehr und höre nach der Saison auf'. Trotzallem
      freuten wir im wieder, dass es doch noch weiterging.
    
      <br>
      ...
     </div>
    </div>
    css
    Code:
    /* ######################################################################################################
    ** ### DIV-Container Newsarchiv        ##################################################################
    ** ######################################################################################################
    */
    #divShowNewsPreview {
    	margin: 0 0 0 10px;
    	text-align: left;
    }
    #divShowNewsPreview .fullpost {
    	overflow: hidden;
    	margin: 10px 0 0px;
    	display: block;
    	padding: 5px;
    	border: 1px #333 ridge;
    }
    #divShowNewsPreview .dateline {
    	font-style: italic;
    	margin-top: 5px;
    	margin-bottom: 1em;
    	text-align: right;
    }
    #divShowNewsPreview  .news_text {
       text-align:left;
    	text-align:justify;
    	font: normal 13px/18px Verdana, Arial, Helvetica, sans-serif;
    	margin: 10px 0 5px;
    	
    }
    #divShowNewsPreview  .news_text img {
    	border: none;
    	margin: 0;
    	padding:0;
    	border-bottom: 1px black solid;
    	display: block;
    }
    #divShowNewsPreview  .news_text .right{
    	float: right;
    	margin: 5px 0 0 20px;
    	padding:0;
    	border:1px black solid;
    	text-align:center;
    }
    #divShowNewsPreview  .news_text .left {
    	float: left;
    	margin: 5px 20px 0 0;
    	padding:0;
    	border:1px black solid;
    	text-align:center;
    }
    #divShowNewsPreview  .news_text .subtitle {
    	text-align:center;
    	font: italic 11px/14px Verdana, Arial, Helvetica, sans-serif;
    	padding: 5px 0 5px;
    }
    Anbei noch 2 gifs!

    Über Hinweise, die zur Ergreifung des Problems führen, wäre ich sehr erfreut

    Gruß
    derTallala
    Angehängte Dateien
    Manchmal verliert ma eben ... und manchmal gewinnen die Anderen

  • #2
    Re: [CSS] wieder mal macht der IE Ärger

    Du erstellst ungültigen HTML-Code - und wunderst dich dann, wenn's nicht wie gewünscht angezeigt wird?

    Solltest doch auch du langsam begriffen haben, dass die Herstellung validierenden Codes als allererstes kommt. Erst danach werden Darstellungsprobleme betrachtet.
    I don't believe in rebirth. Actually, I never did in my whole lives.

    Kommentar


    • #3
      Also wenn du mit Problem meinst, dass das Bild über den div hinausläuft, dann würde ich mal sagen Works as Designed ! Divs legen ihre Grösse immer anhand des Inhalts an. Als Inhalt kann ein div aber nur das "sehen" was im Dokumentfluss hängt. Ein gefloateter Inhalt ist eben ausserhalb des Dokumentsflusses und hat daher keinen Einfluss auf ein umgebendes Div (dein img ist ja rechts floatend)
      Das Problem dürfte verschwinden wenn du mehr Texthöhe als Bildhöhe hast. Alternativ könntest du mit min-height arbeiten, was dann aber nicht alle Browser interpretieren.
      Was aber immer gilt, wie wahsaga schon schrieb: Validen HTML Code bitte...

      Gruss

      tobi
      Gutes Tutorial | PHP Manual | MySql Manual | PHP FAQ | Apache | Suchfunktion für eigene Seiten

      [color=red]"An error does not become truth by reason of multiplied propagation, nor does truth become error because nobody sees it."[/color]
      Mohandas Karamchand Gandhi (Mahatma Gandhi) (Source)

      Kommentar


      • #4
        Original geschrieben von jahlives
        Alternativ könntest du mit min-height arbeiten, was dann aber nicht alle Browser interpretieren.
        Oder Container ebenfalls floaten, oder overflow einsetzen, ...
        I don't believe in rebirth. Actually, I never did in my whole lives.

        Kommentar


        • #5
          oder ein <div style="clear: both;"></div> in das container Div's der floats rein.

          Kommentar


          • #6
            Das mit dem nicht validen Code kann ich mir nicht erklären!

            Normalerweise jag ich den immer durch den Validator, bevor ich den irgendwo poste.

            So, mal valide.
            http://hafenvolleyballer.de/AJAX/format.php

            Mir ist schon irgendwie klar, dass es an dem gefloateten Bild liegt.
            "overflow: hidden" hab ich auch schon an diversen Stellen eingesetzt, behebt aber mein Problem nicht.

            Trotzdem Danke für Euer Bemühen
            derTrallala
            Manchmal verliert ma eben ... und manchmal gewinnen die Anderen

            Kommentar


            • #7
              Original geschrieben von prego
              oder ein <div style="clear: both;"></div> in das container Div's der floats rein.
              Jip -- works!

              thanxs
              Manchmal verliert ma eben ... und manchmal gewinnen die Anderen

              Kommentar

              Lädt...
              X