🚀 go-pugleaf

RetroBBS NetNews Server

Inspired by RockSolid Light RIP Retro Guy

Article View: pl.comp.www
Article #408590

Re: div float

#408590
From: Wojtek Gapiński
Date: Fri, 18 Aug 2017 14:38
42 lines
2846 bytes
W dniu 18-08-2017 o 11:54, Jivanmukta pisze:
> W dniu 2017-08-18 o 11:39, Jivanmukta pisze:
>> W dniu 2017-08-18 o 13:21, Wojtek Gapiński pisze:
>>> W dniu 18-08-2017 o 10:11, Jivanmukta pisze:
>>>> Mam na stronie diva zawierającego trzy divy, które chciałbym
>>>> wyświetlać obok siebie. Z nieznanego mi powodu ostatni wyświetla się
>>>> poniżej dwóch poprzednich (które wyświetlają się prawidłowo, tzn. obok
>>>> siebie). Drugi div kończy się mniej więcej w połowie szerokości okna.
>>>>
>>> [...]
>>>> Proszę o podpowiedź co zrobić, żeby div.tip wyświetlał się z prawej
>>>> strony div.control, tzn. obok a nie pod.
>>>
>>> Stawiam, że nie mieści się na szerokość ten trzeci <div>, dlatego
>>> wyświetla się poniżej.
>>> Sprawdź szerokość elementu nadrzędnego (czyli <div
>>> id="property_pictures_field"> pamiętając o paddingach, a następnie
>>> zsumuj całkowite szerokości wszystkich trzech elementów wewnątrz niego
>>> (czyli div-y o klasach "label", "control" i "tip"). Całkowite, czyli z
>>> marginesami i paddingami. I zobacz, co jest większe.
>>>
>>> pozdrawiam
>>
>> Trzeci div (div.tip) zawiera tylko tekst. Jeśli skrócę tekst np. do
>> jednego wyrazu, to wyświetla mi się div.tip dobrze (z prawej strony).
>> Chciałbym, żeby mój tekst w div.tip został złamany na wielowierszowy i
>> wyświetlał się z prawej strony. Jak to zrobić?
> 
> dodanie dla div.tip stylu "word-wrap: break-word;" nie pomaga

div będzie się rozciągał w zależności od zawartości. Możesz mu ustawić 
stałą szerokość albo max-width. Ale jeśli strona ma być responsywna, to 
musiałbyś to ułożyć inaczej, np. skorzystać z metody użytej w 
bootstrapie albo podobnym frameworku.

Opcjonalnie możesz wstawiać znaki podziału wiersza w tekście - tam, 
gdzie mają być zawijane wiersze, ale to raczej toporne rozwiązanie.

pozdrawiam
-- 
Wojtek Gapiński
http://www.phprogramista.pl
Technical Details
Message-ID: <on6u60$1qqp$1@gioia.aioe.org>
Path: mbox-mo1.pugleaf.net!news-archive.icm.edu.pl!news.icm.edu.pl!news.nask.pl!news.nask.org.pl!news.unit0.net!news.mixmin.net!aioe.org!.POSTED!not-for-mail
References: <on6eg7$7d4$1@news.icm.edu.pl> <on6ikd$17s2$1@gioia.aioe.org> <on6jm8$t2c$1@news.icm.edu.pl> <on6khq$laj$1@news.icm.edu.pl>

Show Full Headers
Complete Article Headers
Path: mbox-mo1.pugleaf.net!news-archive.icm.edu.pl!news.icm.edu.pl!news.nask.pl!news.nask.org.pl!news.unit0.net!news.mixmin.net!aioe.org!.POSTED!not-for-mail
From: Wojtek Gapiński <wojtas_g.WYTNIJ.TO@wp.I.TO.TEZ.pl>
Newsgroups: pl.comp.www
Subject: Re: div float
Date: Fri, 18 Aug 2017 16:38:58 +0200
Organization: Aioe.org NNTP Server
Lines: 42
Message-ID: <on6u60$1qqp$1@gioia.aioe.org>
References: <on6eg7$7d4$1@news.icm.edu.pl> <on6ikd$17s2$1@gioia.aioe.org> <on6jm8$t2c$1@news.icm.edu.pl> <on6khq$laj$1@news.icm.edu.pl>
NNTP-Posting-Host: W6O+i92HF574szyF6hy2ug.user.gioia.aioe.org
Mime-Version: 1.0
X-Complaints-To: abuse@aioe.org
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:52.0) Gecko/20100101 Thunderbird/52.3.0
X-Notice: Filtered by postfilter v. 0.8.2
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit