  |
| Autor |
Nachricht |
bigbuelten
Neuer [User]
Anmeldung: 14.08.07
Beiträge: 4
|
 Verfasst am: 14.08.2007, 08:39 Titel: Hilfe bei der Gestaltung mit Ebenen |
 |
|
Ich benötige dringend Hilfe!
Habe eine Website für ein Schuhgeschäft erstellt und mit vielen Ebenen gearbeitet.
Nach einigen Schwierigkeiten habe ich es geschafft, dass die Ebenen bei den "gängigen" Auflösungen (800x600, 1024x768) an der richtigen Stelle erscheinen. Bei den 15,4 '' Displays verschieben sich jedoch die Ebenen.
Was muss ich ändern, damit es bei wirklich jeder Auflösung funktioniert???
Vielen Dank für Eure Hilfe!!!
Hier ein Beispiel:
 http://www.sportfreak-online.de/demo/web-content/tennis_fila.html
|
|
| Nach oben |
|
 |
thepiep
Beliebter [User]
Anmeldung: 24.08.06
Beiträge: 338
Wohnort: Aachen
|
| Verfasst am: 14.08.2007, 21:47 Titel: |
|
|
Abgesehen davon, dass der Quelltext eine mittlere Katastrophe ist...
Einer-seits definierst du fast alle Elemente mit absoluten pixel-angaben und andererseits steht da margin:auto - das passt nicht zusammen,
absolute angaben, auch wenn es manchmal etwas missverständlich ausgedrückt ist, beziehen sich nur dann auf das direkte mutter-element, wenn dieses selbst absolut positioniert wurde, was hier nicht der fall ist - weswegen sich alles verschiebt.
abhilfe: statt margin:auto;
| Code: | position:absolute;
left: 50%
top: 0;
margin-left:-512px;
width:1024px; |
>(keine garantie)
|
|
| Nach oben |
|
|
bigbuelten
Neuer [User]
Anmeldung: 14.08.07
Beiträge: 4
|
| Verfasst am: 16.08.2007, 09:54 Titel: |
|
|
Hallo thepiep,
erstmal vielen Dank für die schnelle Antwort. Ich habe die Seite nun mit versch. Browsern u. Auflösungen getestet und festgestellt, dass sich die Ebenen nur beim Firefox verschieben bei 1200x800.
Dann habe ich den Quelltext entsprechend Deinem Vorschlag geändert und alles war nach links verschoben. Habe dann experimentiert und folgene Variante erfolgreich getestet:
position:absolute;
left: 50%
top: 0;
width:1024px;
Also margin-left:-512px; einfach weggelassen. Nun funktionierts auch beim Firefox.
|
|
| Nach oben |
|
|
chris1988
Bekannter [User]
Anmeldung: 12.12.05
Beiträge: 1688
|
| Verfasst am: 16.08.2007, 13:22 Titel: |
|
|
Hallo,
im IE6 scheint's aber noch nicht zu passen... im IE7+FF2 läuft's bei mir problemlos!
Screenshot (IE6, 1280*1024):
_________________
Mancher ertrinkt lieber,
als daß er um Hilfe ruft.
(Wilhelm Busch)
|
|
| Nach oben |
|
|
bigbuelten
Neuer [User]
Anmeldung: 14.08.07
Beiträge: 4
|
| Verfasst am: 16.08.2007, 14:28 Titel: |
|
|
Hallo chris1988,
das sieht ja echt sch.. aus! Hab' nochmal was geändert. Der aktuelle
link lautet nun http://www.sportfreak-online.de/laufen_fila.html
Habe auch mit IE 6 ein ansprechendes Ergebnis. Allerdings bei 1200x800.
Kannst Du mir nochmal einen Screenshot mit der Auflösung 1280x1024 hochladen? Ich hoffe, auch da passt es nun.
Falls nicht: HILFE!
Außerdem hätte ich das ganze auch gern bei den 1200er Auflösungen zentriert. Hab es bislang nicht geschafft und bin für Eure Tipps dankbar!
|
|
| Nach oben |
|
|
bigbuelten
Neuer [User]
Anmeldung: 14.08.07
Beiträge: 4
|
| Verfasst am: 16.08.2007, 14:39 Titel: |
|
|
Hallo nochmal,
ich meinte natürlich, es funktioniert bei 1280x800.
Vielleicht könntest Du auch mal testen, wie die Seiten aussehen,
wenn Du folgende Startseite anklickst: http://www.sportfreak-online.de/index2.html
Habe alles mal in einen Frameset gepackt. Funktioniert's ???
Kann leider die Auflösung 1280x1024 nicht testen und bin deshalb auf Hilfe angewiesen.
|
|
| Nach oben |
|
|
chris1988
Bekannter [User]
Anmeldung: 12.12.05
Beiträge: 1688
|
| Verfasst am: 16.08.2007, 20:54 Titel: |
|
|
Ach du meine Güte,
wie peinlich 
Das ganze war mein Fehler!
Benutze den IE nur zu testzwecken, und prüfe dabei auch, wie sich meine Layouts bei Schriftgrößenänderungen verhalten - stand noch auf "Sehr Groß", daher wohl die Verschiebungen 
Zur mittleren Positionierung:
probier mal das hier
| Code: | | <div style="color: black; font-size: medium; font-family: serif; visibility: visible; display: block; position: absolute; width: 1024px;"> |
durch das hier zu ersetzen
| Code: | | <div style="color: black; font-size: medium; font-family: serif; visibility: visible; display: block; position: absolute; left: 50%; width: 1024px; margin-left: -512px;"> |
EDIT: Ist gleich das erste <div> 
_________________
Mancher ertrinkt lieber,
als daß er um Hilfe ruft.
(Wilhelm Busch)
|
|
| Nach oben |
|
|
chris1988
Bekannter [User]
Anmeldung: 12.12.05
Beiträge: 1688
|
| Verfasst am: 16.08.2007, 20:57 Titel: |
|
|
Ach ja:
dabei solltest du Bedenken, dass es dann aber bei kleineren Auflösungen zu Problemen kommen kann!
_________________
Mancher ertrinkt lieber,
als daß er um Hilfe ruft.
(Wilhelm Busch)
|
|
| Nach oben |
|
|
|
|
