tutorials.de Buch-Aktion 05/2012
Like Tree1Danke
  • 1 Beitrag von hela
ERLEDIGT
JA
ANTWORTEN
5
ZUGRIFFE
545
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    BenschM@ster BenschM@ster ist offline Mitglied Silber
    Registriert seit
    Jun 2003
    Ort
    Pfungstadt
    Beiträge
    81
    Hi allerseits,

    und mal wieder habe ich ein Problem mit dem Internet Explorer.
    Unfassbar.

    Ich habe ein Div in einem Div.
    Das innere Div soll ein dünner farbiger Streifen oben am äußeren Div sein für die Überschrift.
    Allerdings hat das äußere Div eine Padding Angabe von 3px.
    Aus diesem Grund habe ich dem inneren Div die Angabe position:relative und top:-3px sowie left:-3px gegeben, da ansonsten rund um das innere DIV ein weißer Rand von 3px wäre.
    Gleichzeitig habe ich das innere Div um 6px vergrößert.

    Im FF ist alles super.
    Im Internet Explorer dagegen verhält er sich leider nicht korrekt. Auf derrechten Seite ist nun ein weißer Rand von 6px.

    Wie kann ich dagegen vorgehen?
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    zeig doch bitte mal den dazugehörigen Quellcode.
     

  3. #3
    BenschM@ster BenschM@ster ist offline Mitglied Silber
    Registriert seit
    Jun 2003
    Ort
    Pfungstadt
    Beiträge
    81
    Alles klar.
    CSS hier:
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    
    /*DIVs für die Backend-News*/
    div.news_left {
    border: 1px black solid;
    padding: 3px;
    width: 340px !important;
    width: 334px;
    font-family: Arial;
    float:left;
    font-size: 12px;
    margin-bottom: 20px;
    }
     
    div.news_right {
    border: 1px black solid;
    padding: 3px;
    width: 340px !important;
    width: 334px;
    font-family: Arial;
    float:right;
    margin-bottom: 20px;
    }
    /*
    div.news_right {
    border: 1px black solid;
    } */
     
    div.news_header {
    width: 346px;
    background-color: #deddff;
    position:relative;
    top: -3px;
    left: -3px;
    font-size: 14px;
    }

    PHP-Code:
    for($i=0;$i<$anz;$i++) {
        list(
    $time_posted,$ueberschrift,$nachricht) = mysql_fetch_row($sql);
        if(
    $schalter == 0) {
            echo 
    '
                <div class="news_left">
                              <div class="news_header">'
    .$ueberschrift.'</div>
                               '
    .$nachricht.'
                             </div>
                     '
    ;
            
    $schalter 1;
             }
             else {
            echo 
    '
                <div class="news_right">
                              <div class="news_header">'
    .$ueberschrift.'</div>
                               '
    .$nachricht.'
                             </div>
                     '
    ;
                 
    $schalter 0;
             }



    Hoffe das ist ok mit PHP. Könnte jetzt auch einen Ausschnitt aus dem generierten Quelltext zeigen...

    Das Problem ist übrigens, dass der Internet Explorer das äußere Div ausdehnt.
    Sprich die Größenangaben sind dann völlig egal, er macht das immer 6px größer als das innere Div.
     

  4. #4
    Maik Tutorials.de Gastzugang
    Das ist ja mal eine verzwickte Geschichte.

    Und wenn du auf die padding-Deklaration für das äußere DIV, sowie die Positionierung des inneren DIVs verzichtest?

    Falls der nachfolgende Inhalt den horizontalen Innenabstand besitzen soll, könntest du ihn ja entsprechend formatieren.
     

  5. #5
    Avatar von hela
    hela hela ist offline Mitglied Smaragd
    tutorials.de Premium-User
    Registriert seit
    Oct 2004
    Beiträge
    1.123
    Als Tipp: Versuch es mal mit negativen margin-Werten statt der Positionierung. Kann mich erinnern, dass ich mal ähnliche Probleme hatte und es damit funktionierte. Leider habe ich die Einzelheiten nicht mehr parat.
    BenschM@ster bedankt sich. 

  6. #6
    BenschM@ster BenschM@ster ist offline Mitglied Silber
    Registriert seit
    Jun 2003
    Ort
    Pfungstadt
    Beiträge
    81
    Dankesehr ihr beiden.
    Hab mich jetzt für die Variante entschieden das Padding wegzulassen.
    Allerdings fuchst es mich immer, wenn etwas nicht so klappt wie ich es will und ich klein beigeben muss :-/

    Aber naja für den Internet Explorer sollte man sich die Arbeit sparen.

    Vielen Dank.
    Gruß,
    Ben
     

Ähnliche Themen

  1. padding verhält sich unterschiedlich
    Von one6666 im Forum CSS
    Antworten: 9
    Letzter Beitrag: 03.04.10, 08:36
  2. Antworten: 2
    Letzter Beitrag: 30.06.09, 10:39
  3. Antworten: 5
    Letzter Beitrag: 09.04.09, 20:05
  4. CellEditor verhält sich nicht richtig
    Von BlackPint im Forum Swing, Java2D/3D, SWT, JFace
    Antworten: 0
    Letzter Beitrag: 23.05.07, 12:47
  5. DIV reagiert nicht auf position: relative
    Von Blackburn im Forum CSS
    Antworten: 4
    Letzter Beitrag: 24.04.07, 22:55