🚀 go-pugleaf

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ć?

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

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
-- 
Wojtek Gapiński
http://www.phprogramista.pl

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

W dniu 2017-08-18 o 16:38, Wojtek Gapiński pisze:
> 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.

Moja strona jest responsywna ale nie używam żadnego frameworka, tylko 
media queries. Czy ktoś wie jak to zrobić bez frameworka?
Nie ma sensu ustawiać szerokości div.tip na stałą, chyba że bym w 
JavaScripcie liczył max-width = szerokość div nadrzędnego - szerokość 
div.label - szerokość div.control. Co o tym sądzicie?

Dnia Fri, 18 Aug 2017 10:11:19 +0200, Jivanmukta napisał(a):

> Proszę o podpowiedź co zrobić, żeby div.tip wyświetlał się z prawej 
> strony div.control, tzn. obok a nie pod.

Musisz określić szerokości, najlepiej procentowo (i nie zapomnij o trybie
border-box).

-- 
Borys Pogoreło
borys(#)leszno,edu,pl

W dniu 2017-08-18 o 21:51, Borys Pogoreło pisze:
> Dnia Fri, 18 Aug 2017 10:11:19 +0200, Jivanmukta napisał(a):
>
>> Proszę o podpowiedź co zrobić, żeby div.tip wyświetlał się z prawej
>> strony div.control, tzn. obok a nie pod.
>
> Musisz określić szerokości, najlepiej procentowo (i nie zapomnij o trybie
> border-box).
>
Dzięki Borys, działa!

W dniu 2017-08-19 o 10:00, Jivanmukta pisze:
> W dniu 2017-08-18 o 21:51, Borys Pogoreło pisze:
>> Dnia Fri, 18 Aug 2017 10:11:19 +0200, Jivanmukta napisał(a):
>>
>>> Proszę o podpowiedź co zrobić, żeby div.tip wyświetlał się z prawej
>>> strony div.control, tzn. obok a nie pod.
>>
>> Musisz określić szerokości, najlepiej procentowo (i nie zapomnij o trybie
>> border-box).
>>
> Dzięki Borys, działa!
>

niepojęte,

czy już jest jakiś parametr do rozpychania diva?

próbowałem znaleźć opis, ale wymiękam:
"Za pomocą wartości border-box właściwości box-sizing możemy sprawić, że 
właściwości CSS określające rozmiar obszaru zawartości interesującego 
nas elementu HTML nie będą określały rozmiaru obszaru zawartości 
interesującego nas elementu HTML, lecz będą określały rozmiar 
interesującego nas elementu HTML.
"

W dniu 2017-08-19 o 12:36, w systemie siła 'POPIS/EU pisze:
> W dniu 2017-08-19 o 10:00, Jivanmukta pisze:
>> W dniu 2017-08-18 o 21:51, Borys Pogoreło pisze:
>>> Dnia Fri, 18 Aug 2017 10:11:19 +0200, Jivanmukta napisał(a):
>>>
>>>> Proszę o podpowiedź co zrobić, żeby div.tip wyświetlał się z prawej
>>>> strony div.control, tzn. obok a nie pod.
>>>
>>> Musisz określić szerokości, najlepiej procentowo (i nie zapomnij o
>>> trybie
>>> border-box).
>>>
>> Dzięki Borys, działa!
>>
>
> niepojęte,
>
> czy już jest jakiś parametr do rozpychania diva?
>
> próbowałem znaleźć opis, ale wymiękam:
> "Za pomocą wartości border-box właściwości box-sizing możemy sprawić, że
> właściwości CSS określające rozmiar obszaru zawartości interesującego
> nas elementu HTML nie będą określały rozmiaru obszaru zawartości
> interesującego nas elementu HTML, lecz będą określały rozmiar
> interesującego nas elementu HTML.
> "
Ja tego nie rozumiem, zrobiłem "na pałę":

.tip {
	...
	box-sizing: border-box;
}
     div.tip {
	width: 50%;
         float: left;
	...
     }

i działa.

> .tip {
>      ...
>      box-sizing: border-box;
> }

nie mogę zrozumieć co to za polecenie...

>      div.tip {
>      width: 50%;
>          float: left;
>      ...
>      }
>
> i działa.

dziwne, w sumie nie testowałem, ale wydaje się, że bez szerokości też 
powinno łyknąć...

A moglibyście mi jeszcze dać wskazówkę jak zrobić żeby był mały odstęp 
między div.control a div.tip? Wstawiłem    między te div'y ale nie 
ma efektu. Może da się jakoś inaczej, np. z CSS?

On 01/09/2017 09:54, Jivanmukta wrote:
> A moglibyście mi jeszcze dać wskazówkę jak zrobić żeby był mały odstęp
> między div.control a div.tip? Wstawiłem    między te div'y ale nie
> ma efektu. Może da się jakoś inaczej, np. z CSS?

A nie możesz użyć po prostu właściwości margin z CSS?

-- 
Cezary Tomczyk
Blokowanie automatycznego odtwarzania video na gazeta.pl w Google 
Chrome: https://goo.gl/0kCRLS
https://www.aslint.org/ - Accessibility validator tool

W dniu 2017-09-01 o 18:14, Cezary Tomczyk pisze:
> On 01/09/2017 09:54, Jivanmukta wrote:
>> A moglibyście mi jeszcze dać wskazówkę jak zrobić żeby był mały odstęp
>> między div.control a div.tip? Wstawiłem    między te div'y
>> ale nie
>> ma efektu. Może da się jakoś inaczej, np. z CSS?
>
> A nie możesz użyć po prostu właściwości margin z CSS?
>
Działa, dzięki