CSS + Darstellungsproblem

Seite 1 von 2 - Forum: Coding Stuff auf overclockers.at

URL: https://www.overclockers.at/coding-stuff/css_darstellungsproblem_149270/page_1 - zur Vollversion wechseln!

Facetious schrieb am 14.09.2005 um 13:16

Hi!

Ich hab ein kleines Darstellungsproblem zwischen ie und ff

Code: PHP

<div class="content">
		<span class="pic">
			<img src="imgNews/foo.jpg" alt="" width="50" height="50">
		</span>
		<span class="text">
			Lorem Ipsum quot es Lorem Ipsum quot es Lorem Ipsum quot es Lorem Ipsum quot es Lorem Ipsum quot es Lorem Ipsum quot es Lorem Ipsum quot es Lorem Ipsum quot es Lorem Ipsum quot es  
		</span>
	</div>

css code:

Code: PHP

.newsitem .content .pic {
	float: left;
	padding:5px;
}

und hier die beiden darstellungen:
1.ie

2. ff

hat das was mit den spans zutun?

mfg und thx Facetious

Spikx schrieb am 14.09.2005 um 13:18

1. die Bilder sind gleich? // ok, edited
2. spans haben keine Höhe und Breite und somit auch ka Padding... hmm.. afaik. Du könntest stattdessen <img class="pic" src="...> schreiben.

Facetious schrieb am 14.09.2005 um 13:24

hmm
keine veränderung
ausser dass beim ie die 5px padding-right verschwinden
ff schaut gleich aus

mfg und thx Facetious

watchout schrieb am 14.09.2005 um 14:23

Zitat von Facetious
hmm
keine veränderung
ausser dass beim ie die 5px padding-right verschwinden
ff schaut gleich aus

mfg und thx Facetious

Is auch klar - eigentlich können ja spans (edith: non-replaced inline elements) auch nicht floaten. verwende ein div oder schreib display:block ins style, dann sollte es gehen.

Facetious schrieb am 14.09.2005 um 21:45

sorry
komm erst jetzt zum schreiben

also
ich hab jetzt sowohl probiert die span in divs umzuwandeln
und ich hab es auch probiert den spans display:block zu geben

ohne erfolg

eine eher russische lösung wäre es der
.newsitem class
ein padding-bottom von ca 20px zu geben
wird halt leider wieder je browser anders dargestellt

aber ich glaube es hapert an der height des "parent" divs .. könnte das sein?

mfg & thx Facetious

Rektal schrieb am 14.09.2005 um 21:54

Bitte URL posten.

Facetious schrieb am 14.09.2005 um 22:19

http://facetious.cybton.com/news

Spikx schrieb am 14.09.2005 um 22:23

äh, moment, wieso hat .pic ein padding? Du willst doch an margin?

Facetious schrieb am 14.09.2005 um 22:25

naja
das wars nicht, war nur eine spielerei, weil das bild besser ausgerichtet aussieht mit padding als mit margin

Facetious

Spikx schrieb am 14.09.2005 um 22:31

gib in .newsitem ein position:absolute; dann gehts

Facetious schrieb am 14.09.2005 um 22:35

hmm
ja stimmt, nur muss ich dann auch top und left angaben machen
auf der leeren seite funkts, aber das wird ja dann in eine andere seite eingebunden

und da funkts mit absolute nicht, habs grad ausprobiert
http://facetious.cybton.com/news/absolute.jpg

ich werd schlafen gehn
thx für die hilfe

mfg und thx Facetious

Facetious schrieb am 14.09.2005 um 22:37

grad durch zufall ausprobiert:
bei newsitem: float:left; aktiviert
und jetzt funkts

kA warum, bin kein css genie, aber funktionieren tuts
gn8 Facetious

Spikx schrieb am 14.09.2005 um 22:38

naja, das div richtet sich dann natürlich an das nächste Elternelement aus, das absolut positioniert ist.

Facetious schrieb am 14.09.2005 um 22:40

aha
und warum funkts mit float:left?

Spikx schrieb am 14.09.2005 um 22:43

jo.. weil.. muast hoit in selfhtml nochlesn