• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Absolute Positionierung schlägt fehlt (IE6 und IE7)

J

jschuhma

Neues Mitglied
Hallo miteinander,

es handelt sich um folgende seite: b v v - ivk o vic.de/shop

Speziell um den Header, im FF wird es (OS X & Windows) korrekt dargestellt, im MIE 8 ebenfalls.
Leider machen MIE6 und MIE7 Probleme, sie stellen den Header wie in den unten angehängten Screenshots dar.

Mein HTML-Code:
HTML: 
<link href="styles.css" rel="stylesheet" type="text/css" />
{config_load file="$language/lang_$language.conf" section="index"}
<div id="center">
    <div id="header">
        <div id="logo"></div>
        <div class="login">{$box_LOGIN}</div>
    </div>
    <div id="haupt_nav">
        <div id="home"><a href="index.php"><img src="{$tpl_path}img/start.png" alt="Start" /> </a>  </div>
        <div id="konto">{if $account}<a href="{$account}"><img src="{$tpl_path}img/account.png" alt="{#link_account#}"></a>  {/if} </div>
        <div id="korb"> <a href="{$cart}"><img src="{$tpl_path}img/cart.png" alt="{#link_cart#}" /></a></div>  
        <div id="kasse"><a href="{$checkout}"><img src="{$tpl_path}img/checkout.png" alt="{#link_checkout#}" /></a></div>
        <div id="abmelden">
            {if $account}{php} if (!isset($_SESSION['customer_id'])) { {/php}
                <a href="create_account.php"><img src="{$tpl_path}img/register.png" alt="{#text_register#}"></a>       
            {php} }else{ {/php}
                <a href="logoff.php"><img src="{$tpl_path}img/logoff.png" alt="{#logout#}"></a>               
            {php} } {/php}
            {/if}        
        </div>
        
    </div>
    <div id="header_image"></div>
    <div id="links">
        {$box_CATEGORIES}
        {$box_CONTENT}
        {$box_CART}
        {$box_SEARCH}
        {$box_INFOBOX}
        {$box_ADMIN}
    </div>
    <div id="inhalt">
        <div id="breadcrumps">{$navtrail}</div>
        {$main_content}
    </div>

</div>
Hier mein CSS-Code:
PHP: 
/* ALLGEMEINES */

* { margin: 0; padding: 0; }

html, body, p {
    margin: 0px;
    padding: 0px;
    }

body {
    font-family:Verdana, Sans-serif;
    font-size: 11px;
    color: #555555;
    line-height: 18px;
    background: #ffffff;
    margin: auto;
    background: #ffffff url(../images/header_bg.jpg) repeat-x;
    }

a, a:active, a:visited {
    text-decoration:none;
    color:#333333;
    }

a:hover {
    text-decoration:underline;
    }

img {
    border:0px;
    }

/* LAYOUT */
#center {
    width:1024px;
    margin:auto;
    }
    
#header {
    width:1024px;
    height:89px;
    }

#logo { 
    width:1024px;
    height:89px;
    background: #7691a2 url(img/heading.png) repeat;
    float:left;
    border-bottom: 3px solid #50636f;
    }

#haupt_nav {
    width:1024px;
    height:35px;
    clear:both;
    background: #7691a2;
    color:#ffffff;
    margin-bottom:1px;
    }

#haupt_nav #home{
    float:left;
    padding-left:15px;
    padding-top:10px;
    padding-right:20px;
    }
    
#haupt_nav #abmelden, #haupt_nav #konto, #haupt_nav #korb, #haupt_nav #kasse  {
    float:left;
    padding-left:20px;
    padding-right:20px;
    padding-top:10px;
    }

#header_image {
    width:1024px;
    height:120px;
    background: url(img/header_shop.jpg);
    margin-bottom:1px;
    }

/* KONTAKTFORMULAR  */
#loginbox {
    padding-left:30px;
    }
    
.login {
    height:82px;
    width:275px;    
    background:#7691a2;
    color:#ffffff;
    padding-top:7px;
    margin-left:749px;
    border-bottom: 3px solid #7691a2;
    position:absolute;
    }

.login .feld_name input,
.login .feld_pw input{
    color: #7691a2;
    padding-left: 2px;
    width:150px;
    margin-bottom:3px;
    margin-right:5px;
    border:1px solid #455661;
    height:18px;
    padding-top:2px;
    }

.login_heading {
    padding-top:10px;
    height:20px;
    }

#contact_us input {
    color: #455661;
    padding-left: 2px;
    width:150px;
    margin-bottom:3px;
    margin-right:5px;
    border:1px solid #455661;
    height:18px;
    padding-top:2px;
    }

#contact_us textarea {
    color: #455661;
    margin-bottom:3px;
    margin-right:5px;
    border:1px solid #455661;
    width: 250px;
    height:190px;
    padding-top:2px;
    }

#contact_us .contact_button input{
    width:68px;
    height:19px;
    border:0px;
    float:left;
    margin-left:180px;
    }


/* SEITE PRODUKTDETAILS */
#cart_quantity {
    width:750px;
    float:left;
    }


/* SUCHE */
#suche_input {
    float:left;
    margin-left:20px;
    margin-top:20px;
    }

#suche_input input{
    border:1px solid #455661;
    height:18px;
    padding-top:2px;
    }
    
#suche_button {
    float:left;
    margin-left:5px;
    margin-top:23px;    
    }

#suche_erweitert {
    clear:both;
    margin-left:20px;
    padding-top:5px;
    }


/* SIDEBAR */
#links {
    clear:both;
    width:230px;
    background:#efefef;
    float:left;
    }

#breadcrumps {
    width:100%;
    float:left;
    font-weight:bold;
    }

#inhalt {
    float:left;
    margin:10px;
    width:600px;
    padding:15px;
    }    
    
#rechts {
    float:left;
    background:#efefef;
    width:220px;
    }
    
#quick_find {
    height:100px;
    }

.navilist{
    list-style-type:none;
    }

.subcatlevel1 a {
    font-size:10px;
    font-weight:normal;
    color:#455661;
    display:block;
    width:198px;
    height:23px;
    border-bottom:1px solid #ffffff;
    padding-top:7px;
    padding-left:50px;
    background: url(img/icon_arrow.jpg) no-repeat;
    background-position:32px 14px;
    }

.subcatlevel1 a:hover {
    width: 180px;
    background: #b9d5e3 url(img/icon_arrow.jpg) no-repeat;    
    background-position:32px 14px;    
    }

.sidebar_heading {
    background: #7691a2;
    }

.sidebar_links{
    background:#d7e6ed;
    }

.sidebar_links img{
    display:none;
    }
    
#informationen .sidebar_links .subcatlevel1 {    
    width:230px;
    border-bottom:1px solid #ffffff;
    }    
    
#informationen .sidebar_links a,
#kategorie .maincat a {
    font-size:10px;
    font-weight:normal;
    color:#455661;
    display:block;
    width:198px;
    height:23px;
    border-bottom:1px solid #ffffff;
    padding-top:7px;
    padding-left:32px;
    background: url(img/icon_arrow.jpg) no-repeat;
    background-position:15px 14px;
    }


#informationen .sidebar_links a:hover,
#kategorie .maincat a:hover
{
    background: #b9d5e3 url(img/icon_arrow.jpg) no-repeat;    
    background-position:15px 14px;
    }

#kategorie .sidebar_links .gewaehlt {
    background: #b9d5e3 url(img/icon_arrow.jpg) no-repeat;    
    background-position:15px 14px;
    font-weight:bold;
    }

#kategorie .sidebar_links .subcatlevel1 .gewaehlt {
    background: #b9d5e3 url(img/icon_arrow.jpg) no-repeat;    
    background-position:32px 14px;
    width:180px;
    font-weight:bold;
    }
    
#kategorie, #informationen, #warenkorb {
    background: #d7e6ed;
    padding-bottom:20px;
    }

#kundengruppe .sidebar_links {
    padding-left:20px;
    padding-bottom:20px;
    }

#warenkorb .boxText {
    padding-top:10px;
    padding-left:15px;
    }
    


/* ANPASSUNGEN XT:COMMERCE */
.copyright {
    clear:both;
    text-align:center;
    }    

.parseTime{
    display:none;
    }
Wie kann ich das Problem lösen? Also warum ich das überhaupt mache, nachdem man sich einlogged (könnt euch gerne einen Account erstellen) wird das Log-in Formular komplett ausgeblendet und es wäre nur ein weißer leerer Bereich zu sehen.


Zur Info, es handelt sich hier um einen XT:Commerce Shop.
Wäre spitze wenn mir jemand helfen könnte.


Grüße Jan
 

Anhänge

  • Bild 1.jpg
    Bild 1.jpg
    16,8 KB · Aufrufe: 4
  • Bild 2.jpg
    Bild 2.jpg
    5,7 KB · Aufrufe: 3
Zuletzt bearbeitet:
Imbericle schrieb:
Hallo, du hast 70 html Fehler.
Wenn die entfernt sind dürfts funzen.
Zum Vergrößern anklicken....

hast du natürlich recht, aber nahezu alle Fehler die angezeigt werden, sind Zeilen die XT:Commerce selbst generiert

Line 129, Column 68: XML Parsing Error: EntityRef: expecting ';' …e/shop/shop_content.php?coID=1&XTCsid=707b140f28a60992cf335006ca2dc028">Liefe
Zum Vergrößern anklicken....

da gibts nen rießen haufen davon. Was bei den Bildern falsch läuft weiß ich nicht, in meiner index.html, aus der alles generiert wird, sind die img-tags geschlossen... beim aufrufen auf dem server, sind die / nicht mehr enthalten.

Line 101, Column 178: end tag for "img" omitted, but OMITTAG NO was specified …nd/img/cart.png" alt="Warenkorb"></a></div>
Zum Vergrößern anklicken....

Nen Tip was die Fehler angeht?
 
jschuhma schrieb:
hast du natürlich recht, aber nahezu alle Fehler die angezeigt werden, sind Zeilen die XT:Commerce selbst generiert
Zum Vergrößern anklicken....

Hallo Jan,

wer den Fehler gemacht hat, interessiert den Browser nicht, wenn er Deine Seite anzeigen soll...

jschuhma schrieb:
Line 129, Column 68:
Zum Vergrößern anklicken....
Line 101, Column 178:
Zum Vergrößern anklicken....
Nen Tip was die Fehler angeht?
Zum Vergrößern anklicken....

Fang von oben nach unten an. Viele Fehler sind Folgefehler, die verschwinden,
wenn Du den vorhergehenden ausgemerzt hast...

Heftig auswirken könnte sich m.E. der hier:
Code: 
<body><link rel="stylesheet" type="text/css" href="styles.css" />
Grüße
Bernhard
 
Hallo Bernhard,

danke für deine Antwort. Bin schon verzweifelt auf der Suche nach dem 2. laden eines stylesheets... zumal es diese Datei garnicht gibt ;)
 
sooo konnte den Fehler mit der falschen css doch noch entfernen :)
Trotz allem werden noch zahlreiche Fehler (gute 60) beim validieren angezeigt:

Validator

Wenn jemand weitere Tips hat wäre ich sehr dankbar.

grüße jan
 
jschuhma schrieb:
sooo konnte den Fehler mit der falschen css doch noch entfernen :)
Trotz allem werden noch zahlreiche Fehler (gute 60) beim validieren angezeigt:

Validator

Wenn jemand weitere Tips hat wäre ich sehr dankbar.

grüße jan
Zum Vergrößern anklicken....
such mal nach "html entitys". Die starten mit einem "&" und enden mit einem ";". Beispiel: &amp; statt & etc..
Auf Grund deines Doc-Types musst du selbstschliessende Elemente kennzeichnen. Zb: Statt <img .....> muss <img ..... /> usw...
Mfg
 
Imbericle schrieb:
ahhhm da stehen doch bereits verbesserungsvorschläge/erklärungen wenn du runterscrollst?
Zum Vergrößern anklicken....

in gewissen maße ja, aber ich habe festgestellt, dass das Problem eher wo anders liegt.

Ich füge in der Datei die schließenden / hinzu, jedoch werden diese sobald die Datei auf dem Server übertragen ist ignoriert. :(
 
Die Zahl schrieb:
such mal nach "html entitys". Die starten mit einem "&" und enden mit einem ";". Beispiel: &amp; statt & etc..
Auf Grund deines Doc-Types musst du selbstschliessende Elemente kennzeichnen. Zb: Statt <img .....> muss <img ..... /> usw...
Mfg
Zum Vergrößern anklicken....

so habe den Doc-Type und und den HTML-Eröffnungs-Tag angepasst, jetzt sind es nur noch knappe 40 statt 70 fehler ;)

Validator

Die Entities kann ich nicht manuell bearbeiten, die werden von xt:commerce generiert.
 
Du bist von xhtml1.1strict auf html4.01 umgestiegen... Zeile 3 definierst du aber noch xhtml und die selbstschliessenden Tags musst du wieder zurücksetzen auf <img....> zb..

Ambesten schaust du mal hier im HTML-Forum-Teil in den MFAQ, Da findest du gute Links die sich mit HTML befassen.
Mfg
 
Danke für deine Antwort :)

gibt es irgendwo eine Übersicht welche Kombination von DocType und HTML-Öffnungs-Tag perfekt zusammenpasst?

In der FAQ habe ich nur den DOCTYPE gefunden.
Bin mir nicht sicher was genau was bewirkt.

Grüße Jan
 
Am besten ist es immer, mit dem aktuellsten Doctype zu arbeiten, dann lernt man es gleich richtig.

In deinem Fall (wo du nichts dafür kannst) solltest du entweder den Verantwortlichen für diesen Bullshit mal ansprechen oder schau dir mal das hier an, beschreibt den Unterschied zwischen "alt" und "neu" eig. ganz gut.

Einer der wichtigsten Unterschiede bei den Stand-alone Attributen (img, br, meta...) ist aber, dass man in XHTML statt <br> nun <br /> schreibt :) Genauso in die andere Richtung.

Greetz
Toast
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben