Text box background behavior with responsive fonts

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
BWoods
 
 
Posts: 6
Joined: Sat Mar 17, 2018 1:59 am

Text box background behavior with responsive fonts

Post by BWoods » Mon Apr 16, 2018 9:22 pm

Hi Pablo,
When setting up a web site to use responsive fonts in a text object with backgrounds I noted a funny behavior. I am using WWB ver 12.3.1 Bear with me for a second:

1. Create a page with the default size 1280 about 1000 long.
2. Put in a 1280 layer around 900 long with style set to an image for the background.
3. Put in a second layer 1250 wide 900 long.
4. Copy paste about 20 lines of text to the second layer. Size to almost fill the width at the top of the layer and set the text object to responsive text with style background mode gradient.
5. Paste a second set of text under the first with the same settings except set background mode to a solid color.
6. Create a 1024 breakpoint and resize all to fit.
7. Preview the page. When you reduce the width of the web page to trigger 1280 to 1024 the text field set to gradient background will have the gradient color fall short of the text. The text with the solid color will be OK.

Most noticeable or problematic with with the gradient and multicolor gradient background styles. Only way to stretch the gradient color is to pad out the last line with a bunch of carriage returns for blank lines. Will also do this with the other backgrounds to a much lesser extent (takes a longer text box to become problematic).

Is this normal with with web building software? Also did this with the W*b P**s from S***f I previously used.

Thanks, Bob

User avatar
crispy68
 
 
Posts: 298
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Text box background behavior with responsive fonts

Post by crispy68 » Mon Apr 16, 2018 11:18 pm

go to Tools --> Options --> HTML --> in CSS section click the box 'Use CSS3 gradients instead of images when possible'

This should fix your issue.

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

Re: Text box background behavior with responsive fonts

Post by Pablo » Tue Apr 17, 2018 6:06 am

I think crispy68 is right.
If the background is published as image then it will have a fixed size, which is the same for all breakpoints.
Using CSS for gradients, makes the background responsive.

BWoods
 
 
Posts: 6
Joined: Sat Mar 17, 2018 1:59 am

Re: Text box background behavior with responsive fonts

Post by BWoods » Tue Apr 17, 2018 9:39 pm

Ok, will give that a shot.
Thanks, Bob

Post Reply

Who is online

Users browsing this forum: No registered users and 9 guests