XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   Barrierefreiheit (http://xhtmlforum.de/forumdisplay.php?f=78)
-   -   Hintergrund verschiebt sich beim ändern der Browsergröße (http://xhtmlforum.de/showthread.php?t=61070)

guitardude 07.05.2010 12:04

Hintergrund verschiebt sich beim ändern der Browsergröße
 
Hallo alle zusammen,

wie im Titel schon angedeutet habe ich das Problem, dass sich beim ändern der Browsergröße der Hintergrund eines DIV mit 100% Breite ungewollt nach links verschiebt. Ich weiß das man dieses Problem mit einem Hintergrundbild im body oder mit einer mindesgröße für das entsprechende Element lösen kann, aber seht selbst:

Test

Gibt es noch einen anderen Weg dieses Problem zu unterbinden, ich möchte nämlich ungern irgendwelche hacks/fixes für die entsprechenden Browser (IE/Opera5+ & co) implementieren.


Gruß
Der dude

Manfred62 07.05.2010 13:30

Hallo

Bin nicht sicher, ob ichs richtig verstanden hab, aber du hast bei dem 2. div einen inline style drin:
HTML-Code:

<div style="min-width: 930px;" class="searchpanel">
Dadurch verschiebt sich das ganze?

Gruß Manfred

guitardude 07.05.2010 13:50

Zitat:

Zitat von Manfred62 (Beitrag 465514)
Hallo

Bin nicht sicher, ob ichs richtig verstanden hab, aber du hast bei dem 2. div einen inline style drin:
HTML-Code:

<div style="min-width: 930px;" class="searchpanel">
Dadurch verschiebt sich das ganze?

Gruß Manfred

Eigentlich nicht, durch min-width wird das Problem eigentlich gelöst.
Ich würde mir nur gern ein paar weitere Möglichkeiten anhören, falls es diese gibt.


Gruß
Der dude

Manfred62 07.05.2010 14:17

Zitat:

durch min-width wird das Problem eigentlich gelöst.
Mein ich ja, du solltest der .searchpanel die Mindestbreite geben. Dann sind beide divs gleich. Zudem sollte dein div.content "margin: 15px auto" haben.
Dann bleibt er in der Mitte. Dann musst du aber auch dem .content ein feste Breite geben, z.B 990px (und kein width: auto).

Gruß Manfred

BTW: was hat das ganze mit Barrierefreiheit zu tun?? Gehört eigentlich unter CSS.

Skippy 24.05.2012 12:49

Hallo :)

Ich habe gerade ein kleines Problem mit meinem Hintergrundbild meiner Website und bin auf diesen Thread gestoßen, weshalb ich mich hier gleich mal angemeldet habe....

Da ich auch mit sämtlicher Hilfe aus dem Internet nicht weiterkomme, hoffe ich, dass ihr mir weiterhelfen könnt.

Mein Hintergrundbild verschiebt sich beim Verkleinern der Fenstergröße. Da ich absolut keine Ahnung von CSS, Html oder sonstwas habe, funktionierts auch nicht mit Anleitungen ausm WWW.
Ich hab das Hintergrundbild für den body definiert, was glaube ich, genau der Fehler ist. Wie kann ich das nun beheben?

Hier mal der Quellcode:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Adobe GoLive" />
<title>Unbenannte Seite</title>
<link href="css/basic.css" type="text/css" rel="stylesheet" media="all" />
<style type="text/css" media="all"><!--
body { background-image: url(Layout-Dateien/hintergrund.jpg); }
.dsR5 /*agl rulekind: base;*/ { position: absolute; top: 0; left: 0; width: 1024px; height: 217px; }
.dsR8 /*agl rulekind: base;*/ { position: absolute; top: 217px; left: 0; width: 102px; height: 39px; }
.dsR11 /*agl rulekind: base;*/ { position: absolute; top: 217px; left: 102px; width: 74px; height: 39px; }
.dsR14 /*agl rulekind: base;*/ { position: absolute; top: 217px; left: 176px; width: 133px; height: 39px; }
.dsR16 /*agl rulekind: base;*/ { position: absolute; top: 217px; left: 309px; width: 135px; height: 39px; }
.dsR19 /*agl rulekind: base;*/ { position: absolute; top: 217px; left: 444px; width: 93px; height: 39px; }
.dsR22 /*agl rulekind: base;*/ { position: absolute; top: 217px; left: 537px; width: 88px; height: 39px; }
.dsR25 /*agl rulekind: base;*/ { position: absolute; top: 217px; left: 625px; width: 399px; height: 39px; }
.dsR26 /*agl rulekind: base;*/ { width: 1025px; height: 560px; }
--></style>
</head>

<body>
<div align="center">
<div class="dsR26" style=" position: relative; -adbe-g: p,4,4;">
<div>
<img class="dsR5" src="Layout-Dateien/banner.jpg" alt="" height="217" width="1024" border="0" /><img class="dsR8" src="Layout-Dateien/uebermich1.jpg" alt="" height="39" width="102" border="0" /><img class="dsR11" src="Layout-Dateien/galerie1.jpg" alt="" height="39" width="74" border="0" /><img class="dsR14" src="Layout-Dateien/auftraege1.jpg" alt="" height="39" width="133" border="0" /><img class="dsR16" src="Layout-Dateien/westernhorses1.jpg" alt="" height="39" width="135" border="0" /><img class="dsR19" src="Layout-Dateien/gaestebuch1.jpg" alt="" height="39" width="93" border="0" /><img class="dsR22" src="Layout-Dateien/kontakt1.jpg" alt="" height="39" width="88" border="0" /><img class="dsR25" src="Layout-Dateien/rest.jpg" alt="" height="39" width="399" border="0" /></div>
</div>
</div>
</body>

</html>

Wäre super, wenn ihr mir da weiterhelfen könntet!

Vielen lieben Dank schonmal....

Skippy


Alle Zeitangaben in WEZ +2. Es ist jetzt 12:25 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023