polymorph
Avatar polymorph
Themenersteller
lass ich mal noch frei
Beginner (29 Beiträge)

Designproblem mit IE6 und IE7

am 23.11.2010, 20:16 Uhr eröffnete polymorph folgenden Thread
HTML5 & CSS    1955 mal gelesen    7 Antwort(en).

Hallo,

bisher dachte ich, Probleme mit CSS und Xhtml bekomm ich mit Tante G. ganz gut alleine hin, notfalls müssen Kompromisse eingegangen werden.

Allerdings bin ich gerade bei einem Projekt, in welchem ich keine faulen Kompromisse eingehen will, hierbei ist nicht nur SEO wichtig, sondern auch die Benutzerführung.

Allerdings hab ich ein Problem, dass mich bei Nutzern von IE6 und IE7 massiv behindert, da das Design geschreddert wird und mir dadurch wichtiger Platz auf der Seite fehlt.

Es geht um http://hettstedt-online.eu, mit Mozilla ist die Anzeige genau so, wie ich sie haben will, das Foto oben rechts.
Im IE8 wirds auch so angezeigt.

Aber mit IE6 und IE7 eben nicht, da scheint es so, als wäre unter der H1 Ãœberschrift ein Zeilenumbruch, das Bild ist zwar rechts, aber eben nicht am oberen Rand.
Dadurch wird die Navigation und der Rest des Inhalts nach unten verschoben, was natürlich Platz bei der 1024 x 768 Auflösung nimmt, Platz, der aber wichtig ist.

Habe schon in der CSS rumexperimentiert, entweder die Ãœberschrift rutscht auf die rechte Seite oder das Foto rutscht nach unten.

div-technisch habe ich möglichst wenig Verschachtelungen gewählt, soll, wenns geht auch so bleiben, wenn möglich, möchte ich keinen Wrapper benutzen.

Besten Dank für die Hilfe im voraus.


Onlinemarketing und Suchmaschinenoptimierung regional für den Landkreis Mansfeld Südharz http://www.vorwaerts.biz

gambler
Student
Guru (101 Beiträge)
am 23.11.2010, 20:46 Uhr schrieb gambler

Hi Andre,

versuche mal bitte folgendes:

[css]
#titel {
width:400px;
margin-left:25px;
float:left;
}
[/css]

Dann sollte das Bild auch im IE7/6 richtig positioniert sein.

Gruß Stephan


Belegungsplan Ferienwohnung
Blog: Smart-Webentwicklung

polymorph
Avatar polymorph
lass ich mal noch frei
Beginner (29 Beiträge)
am 23.11.2010, 21:45 Uhr schrieb polymorph

Hallo Stephan,

hat funktioniert, wunderbar, vielen Dank für die schnelle Hilfe.

Ich hatte das zwar auch schon probiert, dabei gleichzeitig aber die Navigation auch auf float: left; gesetzt, was nicht funktioniert hat.

Manchmal ist der Ansatz richtig, aber man übersieht die wichtigen Kleinigkeiten.

Vielen Dank nochmal...


Onlinemarketing und Suchmaschinenoptimierung regional für den Landkreis Mansfeld Südharz http://www.vorwaerts.biz

romacron
JDev Xer
Content Gott (1224 Beiträge)
am 24.11.2010, 07:39 Uhr schrieb romacron

Vielleicht noch nachträglich ein Hinweis.

Hatte letztens im IE auch einen ätzenden Verzug. Als ich mit dem IE-Dev-Tool drüber ging, sah ich das der IE nicht angegeben line-height: mit "pt" statt "px" korrigierte.

Wie sieht es eigentlich mit dem Ie6 aus? Wieviel % macht dies bei euch aus?



gelöschter Benutzer
am 24.11.2010, 12:53 Uhr schrieb

romacron schrieb:

Wie sieht es eigentlich mit dem Ie6 aus? Wieviel % macht dies bei euch aus?



Wenn du damit die Besucher meinst, die Zahlen schwanken auf meinen Servern meistens zwischen 4% - 8% laut Piwik. Je nach Zielgruppe, die älteren haben meisten den IE 6, Seiten die für jüngere sind, haben meistens aktuelle Browser.

Bei dem IE6 helfen meistens sehr gut absolute und relative Positionierungen um Probleme mit Float vorzubeugen.

Ist es eigentlich gewollt das alles links ist?
Bei hohen Auflösungen würde es zentriert bestimmt besser aussehen. So wie es jetzt ist, ist rechts alles Weiß und links klebt der ganze Text. Dann ist noch bei der Navigation Home und Anmelden klein geschrieben und News und Impressum groß.


Gruß Thomas


polymorph
Avatar polymorph
lass ich mal noch frei
Beginner (29 Beiträge)
am 24.11.2010, 15:55 Uhr schrieb polymorph

IE6, 7 oder 8 kann ich mit Google Analytics leider nicht trennen, gesamt Explorer sind etwa 20%, kann aber auch mehr werden, wenn ich an die Zielgruppe denke.

@Thomas,

ich habe keinen wrapper benutzt, wollte möglichst wenig verschachtelte Divs nutzen, daher sind das alles aneinander-gereihte Div-Container.
Auch die beiden Aufzählungen sind jeweils 1 Div-Container, hab den zweiten durch den Abstand links eingepasst, beide durch ein clear:both; angepasst.

Alles in einem wird es wohl sehr umständlich werden, den gesamten Inhalt mit Blick auf die Auflösung zu zentrieren, entweder ich nutze eine große Div, in die alles hineinkommt und zentriere diese (dann aber wieder verschachtelt) oder ich muss jeden einzelnen Container zentrieren, dann wirds wieder problematisch mit dem Foto.

Grundsätzlich hab ich´s so aufgebaut, dass es bei der 1024x768 Auflösung nahezu bildfüllend ist, natürlich zieht bei 16:9 Auflösungen alles nach links, um die ursprüngliche Struktur dann ein wenig zu halten, ist der textfluss auf justify gestellt, so ergibt der rechte Außenrand wenigstens noch eine Linie.

Wenn Du natürlich eine einfache Methode kennst, immer her damit, anschauen kann ich mir das Ergebnis ja.

Die Sache mit der Navigation werde ich heute abend beheben, vielen Dank für den Hinweis.


Onlinemarketing und Suchmaschinenoptimierung regional für den Landkreis Mansfeld Südharz http://www.vorwaerts.biz

bhvmedia
Avatar bhvmedia
IT im Haupt- und Nebenberuf
Guru (145 Beiträge)
am 25.11.2010, 09:57 Uhr schrieb bhvmedia

Wo liegt das Problem alles in einen zentrierten Div zu packen? Ist eine CSS Definition und ein DIV in der html und du hast keinen weiteren Streß.

Persönliche Anmerkung: Eine "Ãœbungsseite" online zu stellen ist bei Tante G nicht unbedingt hilfreich was das Ranking betrifft. Du kommst zwar schnell rein "Newbi-bonus" bist dann aber bei fehlenden Inhalten schnell weit hinten verschwunden.
Auch ist das für Kunden nicht so witzig, wenn die Links nicht klappen - da kommt man selten wieder.


Gruß Thomas


Meine-Stadt-Bremerhaven.de
Vieles rund um die Seestadt Bremerhaven
BHV-media.de Meine kleine Agentur

polymorph
Avatar polymorph
lass ich mal noch frei
Beginner (29 Beiträge)
am 25.11.2010, 10:47 Uhr schrieb polymorph

bhvmedia schrieb:

Wo liegt das Problem alles in einen zentrierten Div zu packen? Ist eine CSS Definition und ein DIV in der html und du hast keinen weiteren Streß.

Persönliche Anmerkung: Eine "Ãœbungsseite" online zu stellen ist bei Tante G nicht unbedingt hilfreich was das Ranking betrifft. Du kommst zwar schnell rein "Newbi-bonus" bist dann aber bei fehlenden Inhalten schnell weit hinten verschwunden.
Auch ist das für Kunden nicht so witzig, wenn die Links nicht klappen - da kommt man selten wieder.


Gruß Thomas



Hallo Thomas,

danke für Deine Anmerkung, ich werde mir die Zentrierung nochmal durch den Kopf gehen lassen und anschauen.

Ãœbungsseite schön und gut, an sich wollte ich viel weiter sein, leider komme ich den den letzten Tagen nicht wirklich dazu.
Ich bin jeden Tag 11 Stunden unterwegs, bei anstehendem Winter werdens auch mal 13-14 Stunden, da war es zeitmäßig leider etwas eng.

Momentan gibt es eh keine Zugriffe, die werden sich auch in engen Grenzen halten, da das Internet an Hettstedt vorbeigegangen ist, so muss ich mir zumindest keine Sorgen um verärgerte Besucher machen.
Ansich sollte die Seite auch noch garnicht im Google-Index sein, ich habe sie weder von irgendwo verlinkt, noch irgendwo angemeldet, ganz plötzlich stand die Startseite im Index und nun drückt der Schuh, was die Zeit betrifft.

Ich werde mich aber bemühen...


Onlinemarketing und Suchmaschinenoptimierung regional für den Landkreis Mansfeld Südharz http://www.vorwaerts.biz

  • 1


« zurück zu: HTML5 & CSS

Das Seitenreport Forum hat aktuell 5275 Themen und 36110 Beiträge.
Insgesamt sind 48360 Mitglieder registriert.