CSS. Pozycje elementów

Dla specjalistów Webmastering
#1

Witam. Chciałbym żeby na stronie głównej były takie prostokąty w których zamieszczane by były newsy. Zrobiłem to tak:

#news-tytul {

color:white;

font-size:25px;

padding:15px;

}

#news{


color:white;

font-size:18px;

text-align:justify;

margin-bottom: 20px;

margin-left: 100px;

}

#image {

width: 100px;

float: left;

position:middle;

}

I Powstawiałem w divach te elementy:

Tytuł

treść newsa

obrazek
[/code]

Miało być, że na górze miał być tytuł, a pod nim z prawej strony news, a obok po lewej obrazek, ale niestety obrazek jest po newsem tak dziwnie na ukos.

Jak mam to poprawić. Proszę o pomoc!

#2

A gdzie jest float dla newsa? Nie ma? No to dodaj. Powinno zadziałać.

#3

Próbowałem i float:left i right i nic :frowning:

#4

Spróbuj tak:

#news-tytul {

	color:white;

	font-size:25px;

	padding:15px;

}

#news{

	color:white;

	font-size:18px;

	text-align:justify;

	margin-bottom: 20px;

	margin-left: 100px;

}

#image {

	width: 100px;

	float: left;

}

i tak:

Tytuł

obrazek.jpg
treść newsatreść newsatreść newsatreśćtreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsa newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsatreść newsa
[/code] Nie ma czegoś takiego jak: “position:middle;” Możesz też zrobić ta:

[code]#news-tytul { color:white; font-size:25px; padding:15px; } #news{ color:white; font-size:18px; text-align:justify; margin-bottom: 20px; } #news img { float: left; }
i html tak:

Tytuł

abryser.png[/code]

Wówczas tekst będzie oblewał obrazek.

#5

Teraz wychodzi takie coś:

http://img801.imageshack.us/img801/7224/scryg.jpg

#6

A ten obrazek nie jest szerszy niż 100px? Bo tyle dajesz mu miejsca marginesem treści

#7

Dobra. Już działa, ale jak zrobić żeby gdy tekst będzie dłuższy niż obrazek , by dalszy tekst był pod obrazkiem?

#8

Ten drugi sposób, który podałem tak właśnie będzie działał