Flex container

Questions related to the Responsive Web Design tools of WYSIWYG Web Builder.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.

Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
Post Reply
Lasa
 
 
Posts: 366
Joined: Sat Oct 06, 2018 3:08 pm

Flex container

Post by Lasa » Mon Feb 04, 2019 7:07 pm

I love the way flex container works with images. If you put 4 images side by side as the browser gets smaller the end image get tucked under, the top centers and spaces etc., but if you put a text box of in the mix, the text box stretches out messes up the spacing on the top layer. Is there anyway to keep the text box locked size wise?
Cheers,
Lasa

User avatar
Pablo
 
Posts: 17981
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Flex container

Post by Pablo » Mon Feb 04, 2019 7:20 pm

You can control the flex behavior of object with er object's flexbox properties.
By default text will flow to the full width of its container.

http://www.wysiwygwebbuilder.com/flexbox.html

Lasa
 
 
Posts: 366
Joined: Sat Oct 06, 2018 3:08 pm

Re: Flex container

Post by Lasa » Mon Feb 04, 2019 11:09 pm

Thanks for the link its perfect.
You indicate "By default text will flow to the full width of its container" is there a way to over ride this default I'm not seeing?
As in have the text box NOT flow?
I'd love to use it in a header with text and navigation but the text box messes it up by flowing to the full width.

Maybe some html code?

Cheers,
Lasa

User avatar
Pablo
 
Posts: 17981
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Flex container

Post by Pablo » Tue Feb 05, 2019 7:15 am

Note that this is standard HTML behavior.

You can control the size of the via its flexbox properties.
For example, you can set the flex basis of the text to 25% and other another element to 75%.

Post Reply