Site content overlapping

All WYSIWYG Web Builder support issues that are not covered in the forums below.
Forum rules
IMPORTANT NOTE!!

DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.



PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
Post Reply
tbapcollector
 
 
Posts: 6
Joined: Thu Jul 01, 2021 10:33 pm

Site content overlapping

Post by tbapcollector »

Hello, my client uploaded her website and the content is overlapping. Here is what an example looks like:

https://www.tbcashows.info/CscsMainPage2021.html

I tried to make sure all the text block borders (the little white boxes that show up when you select a textbox) were all not overlapping, but that didn't seem to work. What am I doing wrong?

Thanks in advance.
tbapcollector
 
 
Posts: 6
Joined: Thu Jul 01, 2021 10:33 pm

Re: Site content overlapping

Post by tbapcollector »

Oh yes, I forgot to mention that on my client's computer the overlapping doesn't happen. Only after I publish does the overlapping happen.
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Site content overlapping

Post by crispy68 »

Keep in mind, some browsers will show text slightly different than others which includes character spacing, etc. Make sure that you are allowing extra spacing on the left and right of your text boxes to allow for any slight variances. In other words, do not shrink the text box to the point where the left and right side of the text box is right up to the left and right of the text itself.

for example, Text1 is 867px wide. If changed to 940px wide, then it fixes the overlapping.
User avatar
BaconFries
 
 
Posts: 5328
Joined: Thu Aug 16, 2007 7:32 pm

Re: Site content overlapping

Post by BaconFries »

Carrying on with what crispy has mentioned please read the following
How to optimize text for different browsers?
viewtopic.php?f=10&t=34318
tbapcollector
 
 
Posts: 6
Joined: Thu Jul 01, 2021 10:33 pm

Re: Site content overlapping

Post by tbapcollector »

Hello, thanks for the replies, but they do not seem to be addressing the issue.

Right now when my client looks at her page the text blocks are not overlapping. Only after she publishes does the text overlap (click on this link for example: https://www.tbcashows.info/CscsMainPage2021.html) <-- see how the white text is behind the yellow? How come it does that when all the text blocks are on top of each other with padding when in the editor?
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Site content overlapping

Post by crispy68 »

There is no difference between preview and publish. Does the text overlap when your client previews the site?

Like i said, the text overlaps on my computer and this is due to the fact that there is not enough space given in the text box. I'm not talking padding as padding takes up space. Simply increasing the size of the text box will keep it from wrapping to the next line.
tbapcollector
 
 
Posts: 6
Joined: Thu Jul 01, 2021 10:33 pm

Re: Site content overlapping

Post by tbapcollector »

So I had my client use the preview in browser function and the overlapping is showing in the preview as well. I told her to try to make the text boxes larger. I wish I could get a screen shot of her program because when I was there this morning all of her textboxes are the same size as the text inside and she has put enough vertical space in between. Shouldn't that just mean that each element should push the one below it down? Why would it look fine in the program and then all goofy when looking in the browser?
bkjohns
 
 
Posts: 290
Joined: Wed Nov 14, 2018 5:54 pm

Re: Site content overlapping

Post by bkjohns »

Your clients website doesn't appear to be responsive (no flex grids / layout grids). If that is not the case then perhaps the text boxes are not actually being placed correctly into the grids (borders will turn blue when you insert them into a layout grid). If you aren't using grids, then perhaps that would be something to try as the items in a grid will self distribute and will be responsive.
User avatar
BaconFries
 
 
Posts: 5328
Joined: Thu Aug 16, 2007 7:32 pm

Re: Site content overlapping

Post by BaconFries »

Give the textbox some extra space.
Some browsers show the text a little larger and others browsers show the text a little smaller. It's usually not much but you have to leave some space at the end otherwise the last word in a textline may jump to the next line.
From
viewtopic.php?f=10&t=34318

Inturn what this is saying instead of aligning all the text box handles with the text inside hold onto the handles and simply increase the size by a few extra pixels at the end leaving a space.

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

Re: Site content overlapping

Post by crispy68 »

What causes the text boxes to wrap to the next line is due to a lack of horizontal space not vertical spacing. It may look correct in the workspace but remember browsers are going to render the text slightly different therefore even though it looks correct in the workspace the browser may alter the spacing slightly causing the text to wrap.

As bkjohns mentioned, the best way to avoid any of this is to look at using layout grids so the site is floating.
tbapcollector
 
 
Posts: 6
Joined: Thu Jul 01, 2021 10:33 pm

Re: Site content overlapping

Post by tbapcollector »

I appreciate the replies. Right now the text is in separate text blocks and she is thinking about putting it all into a single text block instead. Would that be good? She doesn't know how to do the grid yet.
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Site content overlapping

Post by crispy68 »

Putting it into a single block is ok as long as it doesnt get too long. The key in that case is to make sure you leave enough vertical spacing between blocks as well for the same reasoning how the browser renders text. The link BF provided can give you more insight on how to set up your text.
Post Reply