Text Allignment Problem

**Tazz** · 01 May 2018, 10:47 PM

Hello everyone,

I have a strange problem happening in a site I have done, and can't seem to fix it. I have attached an image of two screen shots side by side to see the issue.

I have created a site with the full version, and a mobile variant. I have done a bunch of these the same way and have never experienced this issue. The text is great on the main site, but when I view the site on my mobile phone, all the text is going off the right side of the page, and I can not zoom out or scroll over to read it. Apparently the mobile site is locked in properly to it's size on a phone. But the text is going off the right edge and out of it's created borders.

I went back into Xara (Designer Pro X12), and step by step I re-created the text, changed the font to web safe, created another text box and copied and pasted text, etc...and nothing worked, publishing brings the same results every time.

Then I noticed the problem (I think), but can't seem to find a fix. When I select the text box in question with the "select tool" the handles on the selected area are way out to the right, off the page as seen in image 1 on the attachment. If I click the text box with the text tool, as seen in image 2, you can see the text area, where it's supposed to be. I don't understand. I have checked to see if I accidentally have something grouped with the text box, but I don't. No shadows or anything.

Can anyone help. Have you experienced this? I'm frustrated and can't figure out whats going on!

The temp site is online at www.firedupvb.tazzanderson.com

Thank you for any assistance in this crazy thing.

Tazz

**Tazz** · 01 May 2018, 11:04 PM

Just another note....When I preview the site on my computer and minimize the page to represent the mobile variant, it works and looks as it should. It's just the actual published version, and looking at it on a real phone that it goofs all the text up. I have attached showing a small piece of the menu in the preview looking great!

Tazz

Click image for larger version.

Name: Xara Text Issue1.jpg
Views: 91
Size: 96.7 KB
ID: 120764

**Tazz** · 02 May 2018, 12:21 AM

Ok, so i'm still playing around with this peculiar issue. Next step, I selected the background box (the white box that the text is sitting in front of) and then selected the text and grouped all objects together, saved, and published, and now it looks great and exactly as it's supposed to look. I did the same with the about us page, and it worked as well. What the heck??? Why would I have to place anther box behind text or group it to a rectangle to make it align properly within a page online (on the mobile variant)? That's kind of strange isn't it? But it works, so strange or not, if it works haha! Still if any one of you Xara guru's out there might know what is happening please enlighten me. I certainly don't want to have to get in the practice of placing extra rectangles every job and grouping them with my text in order to get things to work properly!

Tazz

**Egg Bramhill** · 02 May 2018, 03:54 AM

Grouping text is not a good idea Tazz as the text becomes an image and Search Engines can't parse image content. Late here, try again tomorrow.

**Egg Bramhill** · 02 May 2018, 04:02 AM

here's just part of your mobile menu copied from the site showing it's just an image.

**Egg Bramhill** · 02 May 2018, 04:05 AM

Another member had a similar issue the other day and I seem to recall it was that the text line was to long (wide).

Try using text Areas and NOT text columns.

**Tazz** · 02 May 2018, 02:08 PM

Originally Posted by Egg Bramhill

Another member had a similar issue the other day and I seem to recall it was that the text line was to long (wide).

Try using text Areas and NOT text columns.

Hi Egg, and thank you for your help.

For the menu sections, I have taken the text tool and drag out the text area to the width and length of the particular area of the menu page. Is that what you mean by area vs column? If so, I have done it all by areas.

I have created about a dozen or more websites with mobile variants (480 px) and never had an issue like this. I'm not sure what to do to fix it. Unless what you're suggesting is something different than what I'm thinking and doing. On the one image I attached, it shows the red dotted line of the text area (correctly where it should be), which is visible when I select the text tool...when I select the Selection tool it shows the handles off the right side of the page but that's not where I created the text area.

When you say the text area was too long (wide), you're not talking about the length top to bottom, but literally the width of the text lines. Mine are created within the width of that mobile variant page width. For example the appetizers text area is actually only 360 pixels wide. But my text when viewed is spilling way off the right side of the screen on the mobile phone.

Tazz