Oblewanie obrazka

[viraptor]

Witam
Jak można (za pomocą css'a najlepiej) ustawić tak obrazek, żeby tekst koło niego nie oblewał go, ale zaczynał się równo z jego prawą krawędzią, nawet jeśli kolejne linie wypadają pod dolnym końcem obrazka.
Próbowałem już umieszczać ten blok w div'ie, ale dla obrazka niestety margin-bottom:auto wynosi 0px...
Za tabelki od razu dziękuję

[bwo]

Nie bardzo Cię rozumiem. Ale chodzi Ci o coś takiego:

-----------
| | lalalaalla
| IMG | lalalal
| |afsadf
-----------

bo jak tak to daj w stylu obrazka: float: left;

[viraptor]

Chodzi mi o taki efekt, jak przy:
<table><tr>
<td><img src="maly_obraz"></td>
<td>długi tekst</td>
</tr></table>
(i obrazek z valign: top) tylko bez zastosowania tabelki.
Nie chce, żeby tekst wchodził mi pod ten obrazek.

[bwo]

Hmmm, spróbuj w głownej warstwie dać dwie nowe, jednej daj width: 30%; float: left; a drugiej width: 60%; float: right;

[Stig]

Jedyne rozwiązanie jakie przychodzi mi na myśl to wstawienie dla znacznika "p" lewego marginesu o długości równej szerokości obrazka. Oraz dodatkowo oczywiście dla img float: left, a dla p clear: right. Tego typu rozwiązanie powszechnie przyjęło się przy tworzeniu dwukolumnowych layout'ów. Zajlepiej zilustruje to przykład:

Kod: Zaznacz cały

<img src="obraz.gif" alt="Alt" width="100" height="80" style="float: left;" /><p style="clear: right; margin: 0 0 0 100px;">Tekst</p>

Hmmm, spróbuj w głownej warstwie dać dwie nowe, jednej daj width: 30%; float: left; a drugiej width: 60%; float: right;

Niestety, przy tego typu rozwiązaniu dłuższy tekst zjedzie poniżej obrazka.

[Piotr.ek]

Witam
Jak można (za pomocą css'a najlepiej) ustawić tak obrazek, żeby tekst koło niego nie oblewał go, ale zaczynał się równo z jego prawą krawędzią, nawet jeśli kolejne linie wypadają pod dolnym końcem obrazka.
Próbowałem już umieszczać ten blok w div'ie, ale dla obrazka niestety margin-bottom:auto wynosi 0px...
Za tabelki od razu dziękuję

jeśli cię dobrze zrozumiałem, to zrobiłem coś, co ci się przyda, jeżeli natomiast źle cię zrozumiałem, to trudno
http://janek.mrok.org/csslab/floating.html

[bwo]

Hmm, ja pisząc tamto wyżej chciałem właśnie zrobić coś takiego jak Piotrek, bo tak samo zrozumiałem problem. Dobrze go zrozumieliśmy, czy miałeś coś innego na myśli?

Stig, zejdzie poniżej obrazka to mas zna myśli ze będzie pod obrazkiem, czy tak jak u Piotr.ka? Bo wg mnie to bedzie tak jak u Piostr.ka.

[viraptor]

No masz właśnie przed chwilą wykombinowałem też z margin-left i chciałem sprawdzić, czy coś lepszego mi zaproponujecie. Dzięki w każdym razie - zrobiłem to margin-left'em i działa.

[Stig]

jeśli cię dobrze zrozumiałem, to zrobiłem coś, co ci się przyda, jeżeli natomiast źle cię zrozumiałem, to trudno
http://janek.mrok.org/csslab/floating.html

Wcześniej podałem niemalże identyczne rozwiązanie

Stig, zejdzie poniżej obrazka to mas zna myśli ze będzie pod obrazkiem, czy tak jak u Piotr.ka? Bo wg mnie to bedzie tak jak u Piostr.ka.

Przy podanym przez Ciebie rozwiązaniu cześć tekst na wysokość nie przekraczającą wysokości obrazka będzie po prawej stronie, natomiast, część, która przekroczy wysokość obrazka, zajdzie na dół. Wypróbuj zaproponowane przez siebie rozwiązanie, a przekonasz się jak to wygląda.

[bwo]

Zrobiłem tak i jest dokłądnie jak u Piotr.ka tylko dałem 40% zamiast 30%, żeby tekst był zaraz obok obrazka.