CSS Bildpositionierung bei Firefox/Opear

**Kropff** · 15.12.2006, 14:08

da helfen keine screenshots, sondern code. oder eine online-version

gruß
peter

**tams** · 15.12.2006, 16:05

Hhmm, versteh ich nicht, ich hab doch einen Link zur meiner noch unfertigen programmierten Version genannt. Aber hier noch mal mein bisheriger Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Unbenannt</title>
</head>

<body>
<!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>

<title>Layout</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css"></style>
</head>
<body>

<div id="inhalt">
<div id="land"><img src="images/land_in_sicht.gif" alt="" /></div>

<div id="logo"><a href="#"><img src="images/logo_steuermann.gif" alt="" /></a></div>

<div id="kontaktkompass"><img src="images/kontakt_kompass.gif" alt="" /></div>

<div id="achtungkompass"><img src="images/kontakt_achtung.gif" alt="" /></div>

<div id="barountenrechts"><img src="images/uhr_unten_rechts.gif" alt="" /></div>

</div>

</body>

</html>

</body>
</html>

Gruß
Torsten

**Kropff** · 15.12.2006, 16:20

ups, sorry, dachte das war ein bild.

PHP-Code:


#barountenrechts 

{

   padding-top: ...

}

pass das mal an. und darin noch ein font-size: 0px; für den ie

gruß
peter

**tams** · 15.12.2006, 16:50

Heissen Dank Kropff,

habe ich schon versucht, leider ohne Auswirkungen. Muß noch anders gehen. Der IE interpretiert das irgendwie anders. Entweder ist die Grafik bei Firefox nicht richtig dran oder beim IE.

Gruß
Torsten

**Kropff** · 15.12.2006, 17:00

also so sieht es bei mir in allen browsern gleich aus (ff 1.5 und 2, ie 6 und 7)

PHP-Code:


#barountenrechts {

margin-top: 0px;

padding-top: 20px;

padding-left: 623px;

}

/* IE 6*/

* html #barountenrechts {

font-size: 0px;

}

/* IE 7*/

>body #barountenrechts {

padding-top: 10px;

}

peter

**tams** · 15.12.2006, 17:12

Hallo Kropff,

hmm irgendwie klappt das zwar nun mit IE 7 aber dummerweise sieht es bei Firefox 2.0 und Opera nun so aus:

Firefox 2.0

Sorry, weiß auch nicht was ich verkehrt mache. Habe Deinen Code doch genauso eingebaut:

Aber heissen Dank nochmals.

TorstenGecodete Site

**Kropff** · 15.12.2006, 17:14

bei mir nicht. hast du das padding-top auf 20px gesetzt?

peter

EDIT:
stimmt, 20px. da musst aber noch etwas geändert haben. jetzt klappt es auch bei mir nicht mehr

**tams** · 15.12.2006, 17:17

habe das eingebaut:

#barountenrechts {
margin-top: 0px;
padding-top: 20px;
padding-left: 623px;
font-size: 0px;
}
* html #barountenrechts {
font-size: 0px;
}
body #barountenrechts {
font-size: 0px;
padding-top: 10px;
}

**Kropff** · 15.12.2006, 17:22

komisch. schmeiss das padding-top raus und arbeite mit margin-top. dann klappt es auch. spiel ein wenig herum. du hast ja drei varianten für die browser

gruß
peter

**tams** · 15.12.2006, 17:22

mach ich mal...

**tams** · 15.12.2006, 17:35

Hmmm echt komisch, die Varianten zeigen bei mir irgendwie alle keine Wirkung. Habe das padding-top überall mal rausgeworfen und mit margin-top gespielt. hatte aber entweder nur Auswirkungen auf den IE oder Firefox/Opera. Langsam gebe ich auf. Muß wohl doch wieder mit tabellen arbeiten (seufz)...

**Kropff** · 15.12.2006, 17:38

das forum hat was verschluckt. vor das body #barountenrechts muss direkt ohne leerzeichen ein größer als also >body #barountenrechts

peter

**tams** · 15.12.2006, 17:56

hmmm, gibt's doch nicht. So langsam glaub, daß was mit meinem Browsern nicht stimmt. Genau so hab ich es jetzt eingebaut:

#barountenrechts {
margin-top: 0px;
padding-top: 20px;
padding-left: 623px;
}
/* IE 6*/
* html #barountenrechts {
font-size: 0px;
}
/* IE 7*/
>body #barountenrechts {
padding-top: 10px;
}

Merkwürdigerweise wirken sich Änderungen an:
/* IE 6*/
* html #barountenrechts {
font-size: 0px;
}
/* IE 7*/
>body #barountenrechts {
padding-top: 10px;
}

in keinster Weise bei mir aus.

Einzig Änderungen an:

#barountenrechts {
margin-top: 0px;
padding-top: 20px;
padding-left: 623px;
}

scheinen sich auzuwirken. So wie es jetzt unter folgendem Link
gebaut ist:

Link zum Coding

klappt es auf dem PC nur unter Firefox 2.0 und Opera. Der blöde IE 7.0.5700 will einfach nicht. Solche Probleme sind der Grund warum ich immer noch viel mit Tabellen mache.

Muß nun mal eben kurz in die Autowerkstatt. Wenn ich zurück bin, mach ich weiter. Vielen Dank Dir erstmal!!!!

**Kropff** · 15.12.2006, 18:15

PHP-Code:


>body #barountenrechts {

margin-top: 10px; // MARGIN

}

peter

CSS Bildpositionierung bei Firefox/Opear