Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 13

Thema: div problem mit IE7

  1. #1
    Teeny
    Registriert seit
    08.09.2006
    Ort
    Zürich [ch]
    Beiträge
    47
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard div problem mit IE7

    Salüü zusammen, ich bins wieder mal ^^

    ehm ich habe ein kleines problemchen, und zwar habe ich ein div über ein anderes div gelegt, im FireFox siehts gut aus, aber IE (7) schmeisst es mir irgendwo nach rechts xD

    Das 2. div (das über dem anderen) ist absolut platziert, aber das untere nicht.
    Hat da IE ein problem damit?
    Denn das untere div kann ich ned absolut ausrichten da ich es zentriert haben will, oder kennt einer so einen befehl?

    Hier mal der CSS Ausschnitt:
    Code:
    body{
    margin:
      0px;
    padding:
      0px;
    background-color:
      #a7a7af;
    color:  
      #000055;
    font-family:
      verdana, sans-serif;
    background-image:
      url(media/images/shadow.png);
    background-repeat:
      repeat-y;
    background-position:	center;
    }
    
    #frame{
    width:
      1000px;
    height:
      880px;
    margin-left:
      auto;
    margin-right:
      auto;
    }
    
    #title{
    top:
      10px;
    width:
      1000px;
    height:
      30px;
    position:
      absolute;
    z-index:
      10;
    background-color:
      red;	
    }
    
    #logo{
    float:
      left;	
    background-color:
      #555588;
    width:
      180px;
    height:	
      140px;
    background-image:
      url(media/images/Logo-hp.jpg);
    }
    
    #head{
    float:
      left;
    background-color:
      #333355;
    width:
      820px;
    height:
      140px;
    background-image:
      url(media/images/header-logo.jpg);
    }
    
    #navi{
    float:
      left;
    background-color:
      #222233;
    width:
      1000px;
    height:
      35px;
    background-image:
      url(media/images/Menu_bg.jpg);
    background-repeat:
      repeat-x;
    }
    Der html abschnitt sieht so aus:
    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http&#58;//www.w3.org/1999/xhtml" lang="de" xml&#58;lang="de">
    <head>
             <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
             <meta http-equiv="content-language" content="de" />
             <meta http-equiv="expires" content="0" />
             <link rel="stylesheet" href="design.css" type="text/css" />
    </head>
    <body>
             <div id="frame">
    		<div id="title">
    		</div>
    
    		<div id="logo">
    		</div>
    		
    		<div id="head">
             	</div>
    
    		<div id="navi">
    		</div>
             </div>
    </body>
    Wie immer bin ich für jede Antwort dankbar

    -->Wenn man den Fall mit diesem Code nachstellt (copy paste) sieht man den roten balken der verrückt spielt im IE xD

    //edit: 22:56
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Meister(in)
    Registriert seit
    10.03.2006
    Beiträge
    271
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    also wenn du divs übereinander legen willst, mach das im css file mit dem befehl z-index:

    Die zahl 1 ist dann sozusagen das unterste div, die zahl 2 im anderen div legt sich das div drüber, und mit der zahl 3 kannst dann eines über alle beide legen, und im Prinzip mit ebenen arbeiten... kannst so oft übereinander legen wie du willst

  3. #3
    Teeny
    Themenstarter

    Registriert seit
    08.09.2006
    Ort
    Zürich [ch]
    Beiträge
    47
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    ehm steht ja oben schon *gg*
    problem ist nicht dass, sondern dass der IE mein z-index div einfach mal so schön zur seite schiebt

  4. #4
    König(in)
    Registriert seit
    06.06.2007
    Ort
    Bi
    Beiträge
    1.015
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Wieso richtiest du das untere nicht auch absolute aus, dann würde es doch in beiden Browsern funktionieren....
    Sämtlicher Code erhebt keinen Anspruch auf syntaktische Korrektheit geschweige denn Ausführbarkeit und ist für die Implementation außerhalb der Beispiele nicht geeignet.

    Kein Support für kommerzielle Scripts | Kein kostenloser Support via ICQ

  5. #5
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Probier's mal so:
    Code:
    #title&#123; 
    margin-top&#58; 
      10px; 
    width&#58; 
      1000px; 
    height&#58; 
      30px; 
    background-color&#58; 
      red;    
    &#125;

  6. #6
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    es gibt da noch nen workaround mit javascript....
    einfach die verfügbare breite ermitteln, die durch 2 teilen, dann die halbe breite des DIV ermitteln und dann die sache subtrahieren
    also: halbe screenbreite - halbe divbreite und dieser wert ist dann die style.left-angabe...

    sollte am ende so aussehen:

    Code:
    <html>
    
    <head>
      <title>divs mittig positionieren</title>
      <script type="text/javascript">
    
    function positionieren&#40;&#41;&#123; 
    
    var verfbreite = screen.availWidth;
    
    var target1 = document.getElementById&#40;"DIV1"&#41;;
    var target2 = document.getElementById&#40;"DIV2"&#41;;
    
    var meinebreite =&#40;verfbreite/2&#41;;
    
    var halbtargetbreite1 = parseInt&#40;target1.style.width&#41; /2;
    var halbtargetbreite2 = parseInt&#40;target2.style.width&#41; /2;
    
    target1.style.left = &#40;meinebreite-halbtargetbreite1&#41;;
    target2.style.left = &#40;meinebreite-halbtargetbreite2&#41;  
    &#125;
    </script>
    </head>
    <body onLoad="positionieren&#40;&#41;;">
    <div id="DIV1" style="position&#58;absolute; height&#58;200px; width&#58;200px; z-index&#58;2; background&#58;#000000"></div>
    
    <div id="DIV2" style="position&#58;absolute; height&#58;300px; width&#58;300px; z-index&#58;1; background&#58;#CCCCCC"></div>
    
    </body>
    </html>
    funzt auf jeden fall im IE6 und im FF2.0...
    musste halt nur noch angeben in welcher höhe die DIV sein sollen, hab dafür grad nix angegeben. sollte das imIE7 klappen (oder auch nicht) schreib es kurz hier rein!
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  7. #7
    Teeny
    Themenstarter

    Registriert seit
    08.09.2006
    Ort
    Zürich [ch]
    Beiträge
    47
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Zitat Zitat von sejuma
    Probier's mal so:
    Code:
    #title&#123; 
    margin-top&#58; 
      10px; 
    width&#58; 
      1000px; 
    height&#58; 
      30px; 
    background-color&#58; 
      red;    
    &#125;
    geht leider nicht, es machen einfach alle den abstand zum oberen rand.

    auch wenn ich z-index noch anhänge, geht immer noch ned (beide browser)
    Code:
    z-index&#58;
      2
    wenn ichs dann aber absolut ausrichte, gehts wenigstens unter firefox.
    Aber IE ned,

    @synaptic
    Danke, das ist schon eine lösung, aber ich möchte es wenn es geht ohne scripts lösen, muss doch auch irgendwie gehen ^^
    (haben ja ned alle Java aktiviert, zB mit NoScript von FF)
    aber es wäre sicher eine notlösung

    Kann mir einer sagen, wie ich die div's absolut ausrichten kann, aber trotzdem zentrieren?
    Ich dachte habe mal was von nem koordinationssystem gehört, also nach x- und y- achse ausrichten also dass ich dann irgendwie den x-wert 0 mitgeben könnte um es zu zentrieren.
    Weiss einer obs das wirklich gibt, oder ob ich mich da mal verhört habe ^^
    danke

  8. #8
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    joa, das mit dem nicht aktivierten Scripten hab ich auch schon gehört... nur find ich des doof^^ wofür gibbet denn sowas wie ne scriptsprache?
    problem wird sein, daß man ja beim bauen einer website nicht nur auf kompatibilität der verschiedenen browser achten muss, sondern auch auf verschiedene auflösungen.
    Ich weiß also nicht, ob du komplett scriptfrei arbeiten kannst, wüsste so also auch nicht wirklich, wie man dir helfen könnte.
    von dem koordinatensystem hab ich noch nichts gehört/gelesen.
    ps: JAVA ist NICHT JavaScript

    edit: hab grad mal nach koordinations bzw koordinatensystem gegoogled, aber nicht wirklich was brauchbares gefunden.
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  9. #9
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    @Dragooni:
    Wenn du keinen oberen Abstand haben willst, dann müsste so gehen:
    Code:
    #title&#123;
    width&#58;
      1000px;
    height&#58;
      30px;
    background-color&#58;
      red;
    &#125;
    Muss der title unbedingt "über" den anderen liegen? Wäre doch einfacher, die Höhe der anderen zu kürzen.

  10. #10
    Teeny
    Themenstarter

    Registriert seit
    08.09.2006
    Ort
    Zürich [ch]
    Beiträge
    47
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    einfacher schon, aber ned schöner ^^
    das rote div soll eben halbtransparent werden, sprich ich lege ein png drüber und entferne die rote hintergrundfarbe

    nur muss ich das ding drüber kriegen im IE xD

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •