<div> Reihenfolge und IE Problem

[maximus Caesar]

Hallo alle zusammen,
Ich arbeite gerade an einem Template für Joomla.
Funktioniert soweit auch so wie ich es will.
Jetzt habe ich noch zwei Probleme, bei denen ihr mir vielleicht helfen könnt:

1.
ich habe mein Menü in einem <div> untergebracht, das in das <div> des Inhalts hineinragt (aufgrund der Hintergrundgraphik).
Anzeige ist soweit kein Problem, können auch alle Texte im Inhaltsbereich gelesen werden.
Allerdings wenn dort ein Link enthalten ist, der im Bereich der Hintergrundgraphik des Menüs liegt, kann ich ihn nicht anklicken.
Ich habe versucht die Reihenfolge der div's zu ändern, allerdings verschwindet dann das Menü komplett.
Hier der zugehörige Quelltext:

HTML:

    <div id="Menue">
      <jdoc:include type="modules" name="left" style="xhtml" />      
     </div>
    <div id="Breadcrump"> 
      <jdoc:include type="modules" name="breadcrumb" style="xhtml" /> 
    </div>
    <div id="Inhalt">  
      <jdoc:include type="component" style="xhtml"/>
    </div> 

CSS:

  #Menue {border: none;
    width: 360px;
    height: 500px;
    background-image: url(../images/Streichen.png);
    margin-left: 0px;
    margin-top: 20px;
    position: absolute;
  }

  #Breadcrump { border: none;
    background-color: rgb(203, 249, 209);
    }

  #Inhalt { border: none;
    margin: 0pt 12em 1em 18em;
    padding: 0pt 1em;
    } 

2.
Mein Header besteht aus einer Graphik die Zentriert dargestellt werden soll. Im Firefox kein Problem. Nur im IE wird diese linksbündig dargestellt. Bis jetzt habe ich dafür keine Lösung gefunden.

CSS:

  #Kopf { border: none;
    width: 972px;
    height: 120px;
    background-image: url(../images/Logo.png);
    margin-right:auto;
    margin-left: auto;
  } 

Edit: getestet mit IE 7.0.5730.13

[Kropff]

zu problem 1:
ein online-beispiel verfügbar?

zu problem 2
ggf. background-position

peter

[maximus Caesar]

zu erstens:
Habs mal schnell hochgeladen:
http://www.nimm-und-gib-bc.de/

zu zweites:
Gucks mir gleich mal an
Edit: Funktioniert!
Sieht jetzt so aus:

  #Kopf { border: none;
    width: 100%;
    height: 120px;
    background-image: url(../images/Logo.png);
    background-repeat: no-repeat;
    background-position: center;
  } 

[Kropff]

schau dir das mal im im ie6 an, dann siehst du das problem (stichwort multiple ie).

die lösung: da du unbegreiflicherweise mit position: absolut arbeitest, solltest du auch einen z-index benutzen, denn dein linkes menü liegt über dem inhalt. darum können die links auch nicht angeklickt werden. das problem gibt es übrigens in allen anderen browsern auch. schau dir das mal mit dem firebox inkl. firebug an.

noch ein paar tipps:
- immer mit einer doctype-definition arbeiten
- validen code erzeugen
- & in urls durch & amp; ersetzen

peter

[maximus Caesar]

wie müüste der code lauten ohne absolute? Bekomm das irgendwie nicht hin.
z-index hab ich schon probiert, gab bei mir leider keinen Unterschied.
Edit: Geht doch! Muss Menue einen Negativen z-index zuweisen, dann geht es! Mit einem positiven geht es nicht...


Danke!!!

[Kropff]

informier dich über floaten
und das hintergrundbild kannst du auch in den body packen. oder zerschnipseln und einen ins menue legen und den anderen in den content.

btw: hier gibt es hilfe zur selbsthilfe. keinen fertigen code. also auf geselle, frisch ans werk

peter

ps: hier kannst du alles wichtige nachlesen

[Kropff]

Original geschrieben von maximus Caesar
Edit: Geht doch! Muss Menue einen Negativen z-index zuweisen, dann geht es! Mit einem positiven geht es nicht

oder dem inhalt einen höheren zuweisen. ist aber auch nicht die feine englische art. siehe meinen vorherigen thread.

peter