Bilder verschieben sich nicht bei Browsergrößen änderung

Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon bo2221 » 25.07.2011, 17:55

Hallo ich habe ein kleines Problem

Mir gelingt es einfach nicht das sich ein Bild mit bewegt wenn ich die Browsergröße verändere.

Also das eine Hintergrund Bild was da ist geht mit der Änderung der Browser Größe mit, aber jetzt habe ich ein Bild oben drüber gelegt passend positioniert und nun ändere ich die Browser Größe und das Bild bleibt genau an der Position stehen.


Hier mal der Code

Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" type="text/css"?>
<title>HighRise</title>
</head>
<body>
<div id="header" align="center"><img src="images/header.png" /></div>

<div id="facebook"></div>



</body>
</html>


Code: Alles auswählen
body { background-color:#000000 }

#header { margin-top: -8px; }

#facebook {
    background-image:  url(../images/icons/facebook.png);
   position: absolute;
   width: 30px;
   height: 30px;
   left: 296px;
   top: 10px;
   
}


Beste Grüße
bo2221
neu hier
 
Beiträge: 5
Registriert: 25.07.2011, 17:45

Re: Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon sejuma » 25.07.2011, 18:21

Verzichte auf absolute Positionierung. Die heißt so, weil sie meist absolut unnötig ist und zu Problemen führt.
Positioniere besser mit margin und/oder float.
Bild
sejuma
Vielposter
 
Beiträge: 805
Registriert: 15.07.2009, 17:46

Re: Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon bo2221 » 25.07.2011, 18:26

Ja ok aber wie positioniere ich den ein Div Container über einen anderen, weil das brauche ich?

Gruß
bo2221
neu hier
 
Beiträge: 5
Registriert: 25.07.2011, 17:45

Re: Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon sejuma » 25.07.2011, 18:40

von der HTML-Reihenfolge her erst den "Über-Container", dann den "Unter-Container" (beide dann ohne float bzw. nach dem Über-Container clearen).
Bild
sejuma
Vielposter
 
Beiträge: 805
Registriert: 15.07.2009, 17:46

Re: Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon bo2221 » 25.07.2011, 18:42

tut mir Leid aber ich verstehe nur Bahnhof

kannst du mir vielleicht ein Beispiel zeigen?
bo2221
neu hier
 
Beiträge: 5
Registriert: 25.07.2011, 17:45

Re: Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon bo2221 » 25.07.2011, 19:16

Also ich habe das jetzt so gelößt

Code: Alles auswählen
body { background-color:#000000 }

#header {
    background-image: url(../images/header.png);
   width: 764px;
   height: 346px;
    margin-top: -8px;
   z-index:1; }

#facebook {
   background-image:  url(../images/icons/facebook.png);
   width: 30px;
   height: 30px;
   position:absolute;
   margin-left: 40px;
   margin-top: 10px;
   z-index:2;
}


Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" type="text/css"?>
<title>HighRise</title>
</head>
<body>
<div align="center">

<div id="header" >

<div id="facebook"></div>



</div>


</div>

</body>
</html>


Code: Alles auswählen
http://testseite1.te.funpic.de/
bo2221
neu hier
 
Beiträge: 5
Registriert: 25.07.2011, 17:45

Re: Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon sejuma » 26.07.2011, 06:05

Nimm komplett bei sämtlichen divs die absoluten Positionierungen raus.
Ansonsten richtet sich die Position immer nach dem nächst höher absolut positionierten Element, was zu den genannten Problemen führt.
Bild
sejuma
Vielposter
 
Beiträge: 805
Registriert: 15.07.2009, 17:46

Re: Bilder verschieben sich nicht bei Browsergrößen änderung

Beitragvon bo2221 » 26.07.2011, 16:56

Es ist aber komisch das wenn ich die absoluten positionen raus nehme das die Bilder nicht übereinander liegen wie ich es haben möchte.

So wie ich es momentan habe passt es ja alles.

Ich versehe es irgendwie nicht kannst du mir nicht mal ein beispiel zeigen das ich da durch steige?

Gruß
bo2221
neu hier
 
Beiträge: 5
Registriert: 25.07.2011, 17:45


Moderatoren: Laus, Moderatoren

Ähnliche Beiträge zu "Bilder verschieben sich nicht bei Browsergrößen änderung"

Zurück zu: CSS für Anfänger

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 2 Gäste