[html][css]"uciekające" zdjęcie

Podstrony telcocafe [HTML] Logowanie do ftp poprzez pole tekstowe Jak zrobić logowanie do ftp poprzez pole [HTML] Zła pozycja obrazka tła w tabeli Zła pozycja obrazka tła w komórce tabeli Darmowe statystyki odslon banera dla strony .html Czy istnieja statystyki odslona banera n [html] Newsy i suwak - jak to zrobić? Jak zrobić suwak? [HTML] Miejsce pod formularzem Jak usunąć miejsce pod formularzem? [HTML] '*' == ? Usuwanie zbednych linijek kodu Program do usuwania linijek html [HTML] Formularz liczący punkty Coś w rodzaju testu liczącego punkty ;) [html] Polskie znaki Po wsadzeniu banera, zniknęły polskie znaki [html]W jakiej technice zrobić stronkę? Jestem grafikiem a chce zrobić stronkę.... zanotowane.pl doc.pisz.pl pdf.pisz.pl asfklan.htw.pl		telcocafe Mam kod:<div style="width: 100%; margin-bottom: 2px;"> <div style="position: relative; color: #FFFFFF; background-color: #91C5FF; height: 23px;"> <div style="position: absolute; top: 3px; left: 5px;"> <b>testowy</b> </div> <div style="position: absolute; top: 3px; right: 5px;"> 06-09-2006 10:11 </div> </div> <div style="border-left: 1px solid #4DA3FF; border-bottom: 1px solid #4DA3FF; border-right: 1px solid #4DA3FF;"> <img src="smile.gif" width="100" height="100" alt="" style="float: right;" /> tresc1 </div> <div style="border-left: 1px solid #4DA3FF; border-bottom: 1px solid #4DA3FF; border-right: 1px solid #4DA3FF; clear: both; position: relative; height: 23px;"> <div style="position: absolute; top: 3px; left: 5px;"> Autor: <a href="?mod=usermenu&showuser=aa">%%user%%</a> | Wyświetleń: 0 | Komentarzy: 0 </div> <div style="position: absolute; top: 3px; right: 5px;"> <a href="?mod=news&shownews=aa">Czytaj dalej</a> | <a href="?mod=comments&k=news&id=aa">Komentuj</a> | <b>Źródło: </b>cr </div> </div> </div>Zdjęcie, które tam jest zjeżdża i nie wiem jak to zrobić. Fotka może mieć różne wymiary (to tylko przykład) i musi być na górze po prawej (tekst ma ją oblewać). Nie wiem jak to zrobić. Myślałem nad min-height, ale problemem jest różny rozmiar zdjęcia. Myślałem nad min-height, ale problemem jest różny rozmiar zdjęcia. To może by przez PHP pobrać rozmiar zdjęcia. http://pl2.php.net/m...ion.imagesx.php http://pl2.php.net/m...ion.imagesy.php Nie,to ma być system komentarzy więc to by było dodatkowe obciążenie . . . Wcześniej miało być w tabelce (wyszło wg moich oczekiwań),ale ktoś prowadzi propagandę antytabelkową więc nie chciałem być jego wrogiem :) Jeżeli nie znajdzie się sposób w HTML-u lub CSS-ie to pozostanę przy tabelkach . . . Jeżeli nie znajdzie się sposób w HTML-u lub CSS-ie to pozostanę przy tabelkach . . . rozwiązanie zawsze się znajdzie, tylko trzeba pomyśleć;] Zdjęcie, które tam jest zjeżdża i nie wiem jak to zrobić. hmm... niespecjalnie rozumiem... gdzie ono zjeżdża? jak odpaliłem kod to jest po prawo pod datą. Gdzie w takim razie powinno być? Daj może obrazek jak to powinno wyglądać. Albo stary kod i nowy kod (tabelki i divy) żeby porównać. BTW. i na przyszłość: w takich sprawach staraj się podawać cały kod, bo żeby coś zobaczyć to trzeba sobie "zrobić" plik html z tym. Obrazka nie da rady w Operze Mini. Chyba źle nazwałem,ponieważ obrazek zjeżdża na dolne divy. Tego kodu nie potrzeba wrzucać pod całą strukturę html,sam przed wrzuceniem sprawdziłem. Aha, o co mi chodzi bardzo dobrze widać pod msie. Kodu dla porównania na razie też nie da rady,gdybym miał neta na kompie to co innego . . . O ile dobrze zrozumiałem, to dzieje się tak dlatego, że zastosowałeś position:absolute; powinieneś tego używać tylko w ostateczności. Przez to rozjechała ci się właśnie reszta strony (w tym wypadku widoczne w obrazku). Aby to zniwelować, diva z obrazkiem daj tak: <div style="border-left: 1px solid #4DA3FF; border-bottom: 1px solid #4DA3FF; border-right: 1px solid #4DA3FF; float:right;"> ale i tak wtedy obrazek będzie przesunięty o 1 linię w dół. BTW. moja mała rada, style, szczególnie ostylowania divów nie trzymaj liniowo w style="". Cóż? Position: absolute ponieważ nie wiem jak inaczej (bez tabel) rozrzucić całość po stronie. kutar: nie rozumiem Twojej rady. Np. tak: <div style="width: 100%; margin-bottom: 2px;"> <div style="color: #FFFFFF; background-color: #91C5FF; height: 23px;"> <div style="padding-top:2px; padding-left:5px; display:inline; width:49%;"> <b>testowy</b> </div> <div style="width:50%; text-align:right; display:inline; padding-top:2px;"> 06-09-2006 10:11 </div> </div> <div style="border-left: 1px solid #4DA3FF; border-bottom: 1px solid #4DA3FF; border-right: 1px solid #4DA3FF; float:right;"> <img src="smile.gif" width="100" height="100" alt="" style="float: right;" /> tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 </div> <div style="border-left: 1px solid #4DA3FF; border-bottom: 1px solid #4DA3FF; border-right: 1px solid #4DA3FF; clear: both; height: 23px;"> <div style="padding-top:2px; padding-left:5px; display:inline; width:49%;"> Autor: <a href="?mod=usermenu&showuser=aa">%%user%%</a> | Wyświetleń: 0 | Komentarzy: 0 </div> <div style="width:50%; text-align:right; display:inline; padding-top:2px;"> <a href="?mod=news&shownews=aa">Czytaj dalej</a> | <a href="?mod=comments&k=news&id=aa">Komentuj</a> | <b>Źródło: </b>cr </div> </div> </div> i już nie ma position:absolute; Polecam lekturę http://www.kurshtml.boo.pl kutar,jesteś boski :D display: inline? muszę to wypróbować :D nie pomyślałem o tym . . . Twoją lekturę juz po części prześledziłem jakiś czas temu,ale chyba zbyt dawno . . . muszę ją odnaleźć,gdzieś miałem off-line'a :) kutar,jesteś boski :D display: inline? muszę to wypróbować :D nie pomyślałem o tym . . . Twoją lekturę juz po części prześledziłem jakiś czas temu,ale chyba zbyt dawno . . . muszę ją odnaleźć,gdzieś miałem off-line'a :) nie lepiej display: block; ? Czy display: block nie wyświetla w pionie? Jutro sprawdze jak uda mi się odpalić kompa . . . Może się mylę bo ostatnio zepsułem wygląd strony bawiąc sie wartością display,chociaż zapomniałem co robią poszczególne wartości :P nie lepiej display: block; ? :blink: yyy... no raczej nie. Chcemy to wyświetlić liniowo - w jednej linii. DIV jest domyślnie blokiem, więc jaki sens jest wstawianie w niego display:block; albo nie analizowałeś kodu, albo coś Ci się pokiełbasiło. Haha! Czyli całe float,z którym webmasterzy się męczą przy np.layoutach trzykolumnowych jest niepotrzebne? To mi ułatwia wiele roboty na stronie :D Mam jeszcze jeden problem,ale muszę najpierw zrobić kod. Człowiek uczy się całe życie :P Dzięki kutar! //edit Wszystko by było ok,tylko chciałbym by chodziło to pod Firefoxem :) //edit Wracam do poprzedniego sposobu z position: absolute. Wystarczyło wrzucić float: right w divie nad obrazkiem :D Proste,a jednak trudne . . . Użytkownik andrzej_aa edytował ten post 17 lipiec 2007, 09:42 Haha! Czyli całe float,z którym webmasterzy się męczą przy np.layoutach trzykolumnowych jest niepotrzebne? potrzebne, jak najbardziej, tylko że w tym przypadku zrobiliśmy troszkę inaczej. Wracam do poprzedniego sposobu z position: absolute. Wystarczyło wrzucić float: right w divie nad obrazkiem biggrin.gif Proste,a jednak trudne . . . no tak, właśnie o tym, mówiłem parę postów wcześniej Wszystko by było ok,tylko chciałbym by chodziło to pod Firefoxem smile.gif a no, mój błąd. NIe sprawdziłem jak to pod FF zanim Ci "oddałem" kod. I właśnie w ten sposób myślałem że ładnie bez float się uda. NO to poprawiony, powinno już działać: <div style="width: 100%; margin-bottom: 2px;"> <div style="color: #FFFFFF; background-color: #91C5FF; height: 23px;"> <div style="padding-top:2px; width:49%; float:left;"> <b>testowy</b> </div> <div style="width:50%; text-align:right; float:right; padding-top:2px;"> 06-09-2006 10:11 </div> </div> <div style="border-left: 1px solid #4DA3FF; border-bottom: 1px solid #4DA3FF; border-right: 1px solid #4DA3FF; float:right;"> <img src="smile.gif" width="100" height="100" alt="" style="float: right;" /> tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 tresc1 </div> <div style="border-left: 1px solid #4DA3FF; border-bottom: 1px solid #4DA3FF; border-right: 1px solid #4DA3FF; clear: both; height: 23px;"> <div style="padding-top:2px; float:left; width:49%;"> Autor: <a href="?mod=usermenu&showuser=aa">%%user%%</a> | Wyświetleń: 0 | Komentarzy: 0 </div> <div style="width:50%; text-align:right; float:right; padding-top:2px;"> <a href="?mod=news&shownews=aa">Czytaj dalej</a> | <a href="?mod=comments&k=news&id=aa">Komentuj</a> | <b>Źródło: </b>cr </div> </div> </div> Teraz to nawet width nie jest potrzebny :) Wszystko gra jak należy, dzięki! Chyba jednak muszę się jeszcze wiele nauczyć :) zanotowane.pl doc.pisz.pl pdf.pisz.pl nvm.keep.pl
Sitedesign by AltusUmbrae.