Layer, IE vs. FF!

Status
Nicht offen für weitere Antworten.
BSA

BSA

Erfahrenes Mitglied
Hi Leute!

Ich habe da gerade mal ne Frage. Ich bin gerade dabei das Design für mein Adminmenü zu machen. Nun habe ihc folgendes Problem, bzw. die IE-User hätten ein problem mit meiner jetzigen Seite.

Also, hier könnt ihr euch das problem mal anschauen:

http://icespeedskater.de/community/index.php

Ich denke wenn Ihr euch die Seite einmal im IE und einmal im FF anguckt, dann kennt ihr mein Problem. Vielleicht kann mir ja auch jemand helfen. Ich würde mich sehr freuen.

Gruß
 
Der Opera vermurkst es uebrigens genauso wie der IE hab ich grad gesehen.
Wenn ich die Zeit finde teste ich heut Abend mal mit dem Konqueror.
 
Das wäre sehr nett, könntest du mir dann auch hilfe für die optimierung geben?
 
Poste doch mal Dein CSS-File.
Ich bin zwar absolut nicht der CSS-Guru, eher noch neu auf dem Gebiet, aber ich denk mal, dass es damit zusammenhaengt.
 
Jup, es wird auf jedenfall am Quelltext liegen:

Code: 
<div name="text" style="font-size:10px;font-weight:bold;">Herzlich Willkommen {$username},<br /><br /></div>
<div name="text" style="font-size:10px;">du befindest dich im Adminmen&uuml; der iss-community. Die neusten Eintr&auml;ge sowie die neusten Angemeldeten User und sonstige neue Informationen findest du in den Infoboxen unter diesem Text.<br /><br /></div>

<div style="float:left">
 <!--Newsbox Anfang-->
 <div name="box1" style="float:left;width:2px;height:23px;background:url(img/box_tl.gif) no-repeat;"></div>
 <div name="box1" style="float:left;width:200px;height:23px;background:url(img/box_tli.gif) repeat-x;">
  <div style="font-family:verdana;font-size:10px;padding:3px;">
   News
  </div>
 </div>
 <div name="box1" style="float:left;width:2px;height:23px;background:url(img/box_tr.gif) no-repeat;"></div>
 <div name="box1" style="clear:left;float:left;width:202px;border-left:1px solid #B8BFCA;border-right:1px solid  #B8BFCA;font-family:verdana;font-size:10px;">
  <div style="font-family:verdana;font-size:10px;padding:3px;">
   005 neue News<br />
   500 neue Newskommentare
  </div>
 </div>
 <div name="box1" style="clear:left;float:left;width:2px;height:11px;background:url(img/box_bl.gif) no-repeat;"></div>
 <div name="box1" style="float:left;width:200px;height:11px;background:url(img/box_bli.gif) repeat-x;"></div>
 <div name="box1" style="float:left;width:2px;height:11px;background:url(img/box_br.gif) no-repeat;"></div>
<!--Newsbox Ende-->
</div>
 
Hi,

weise dem umschliessenden DIV die Breite der NewsBox zu. Ansonsten werden mehrere mit
float: left ausgezeichnete Elemente neben- und nicht untereinander angeordnet. Die Passagen
mit clear: left kannst du dann auch wieder entfernen.
HTML: 
<div style="float:left; width: 204px;">
  <!--Newsbox Anfang-->
  ... Deine bisherige NewsBox ohne clear: left;
  <!--Newsbox Ende-->
</div>
Du musst allerdings aufpassen wegen der Breite des Textbereichs innerhalb der NewsBox. Der
IE 6 stellt diese zwar richtig dar, tiefere Versionen werden wegen des Box-Model-Bugs aber
sicherlich Fehldarstellungen erzeugen -> Breite zu gering!

--- EDIT ---
Gerade ist mir im Opera aufgefallen, dass der Headerbalken nicht ganz links angeordnet ist.
Um das zu erreichen solltest du den Innenabstand (padding) im BODY noch Null setzen.
Code: 
body{ padding: 0;}

Ciao
Quaese
 
Zuletzt bearbeitet:
Hi!

Ich glaube, das was Du such, ist das hier:
HTML: 
<div name="text" style="font-size:10px;font-weight:bold;">
  <p>Herzlich Willkommen {$username},<br /></p>
</div>
<div name="text" style="font-size:10px;">
  <p>du befindest dich im Adminmen&uuml; der iss-community. Die neusten
  Eintr&auml;ge sowie die neusten Angemeldeten User und sonstige neue
  Informationen findest du in den Infoboxen unter diesem Text.<br /></p>
</div>
<div style="float:left">
  <div>
    <div name="box1" style="float:left;width:2px;height:23px;background:url(img/box_tl.gif) no-repeat;">
    </div>
    <div name="box1" style="float:left;width:200px;height:23px;background:url(img/box_tli.gif) repeat-x;">
      <div style="font-family:verdana;font-size:10px;padding:3px;">
        News
      </div>
    </div>
    <div name="box1" style="float:left;width:2px;height:23px;background:url(img/box_tr.gif) no-repeat;">
    </div>
  </div>
 <div name="box1" style="clear:left;float:left;width:202px;border-left:1px solid #B8BFCA;border-right:1px solid  #B8BFCA;font-family:verdana;font-size:10px;">
   <div style="font-family:verdana;font-size:10px;padding:3px;">
     005 neue News<br />
     500 neue Newskommentare
   </div>
 </div>
  <div style="clear:left;">
    <div name="box1" style="float:left;width:2px;height:11px;background:url(img/box_bl.gif) no-repeat;">
    </div>
    <div name="box1" style="float:left;width:200px;height:11px;background:url(img/box_bli.gif) repeat-x;">
    </div>
    <div name="box1" style="float:left;width:2px;height:11px;background:url(img/box_br.gif) no-repeat;">
    </div>
  </div>
</div>
Warum hast Du die ganzen CSS Eigenschaften eigentlich nicht in einem extra CSS Bereich bzw. einer extra CSS Datei definiert?

redlama
 
Ich habe das nicht ausgelagert, weil ich mit Templates arbeite und in dieser Datei lediglich zwei drei solcher Boxen einfüge, die immer andere größen haben, und da erschien es mir als sinnlos das ganze Auszulagern.

Aber mal davon abgesehen, es klappt immernoch nicht ganz im IE. Aber auf jedenfall schonmal besser als voher.

Gruß
 
schau doch mal selber....

wenn du keinen IE zur Hand haben solltest, dann kann ich ja mal nen Screenshot ranhängen. der rechte Rahmen ist ein wenig zu weit rechts.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück