My FlexBox tomatos!

Do you want to share WYSIWYG Web Builder tips, tricks, tutorials or useful HTML code? You can post it here...
(no questions or problems please, this section is not monitored by support).
Forum rules
This section is to share tips, tricks and tutorials related to WYSIWYG Web Builder.
Please do not post questions or problems here. They will not be answered.

Post Reply
User avatar
Posts: 30
Joined: Fri Apr 13, 2018 8:23 pm

My FlexBox tomatos!

Post by ConsciouSince2017 » Thu Jul 05, 2018 3:16 am

I cut my teeth with WWB (not literally). Took me a lot of fiddling around with Layers, Grids & FlexBoxes. When I couldn't get what I wanted, I would make a sandwich of flexboxes inside layout grids inside layers. It would work, but I felt I was doing a hack job. Or as my dad says, "..a Mickey Mouse job..." Later, I would discover I just need to read the Help file a little more and practice-practice-practice.

I wanted to share this simple Header + Drop Shadow, for those beginners out there.
NOTE: to streamline future projects, I grouped these layers into a single object and saved it as a Block. Whenever I need it, it's ready-made in my Blocks handy!

Here it is: :arrow:
To create this kind of header, I have the text and logo/icon inside a FlexBox which is set to 'space-between' and the max width to my liking (800px). Since FlexBox doesn't have drop box effect, I drag-n-drop the FlexBox inside a Layer, which DOES have the blury effect. Voila!

Is this how you would achieve this?
[using WWB v12.5]



Get a sharp & professional voice over mp3 (english & spanish)

Post Reply

Who is online

Users browsing this forum: No registered users and 4 guests