Hey, wanna test something? - Post ID...

User 103173 Photo


VP of Software Development
0 posts

johnvanhulst wrote:
Hi Scott,

I found two problems, one big, one small:

1: The size and position of a text box as shown in VSD is different from the size and position of the rendered text in a browser. It is a: shown lower in VSD than what will be rendered, and b: sometimes the rendering is broader than the original textbox. I tried this in Firefox and Chrome.
2: If I use text with 10 pixels in a textbox, then the line of rendered text breaks, no matter how long the VSD textbox is.

I'll make a small example website to show what I mean....

John

Yes, that that will be correct. Each browser and operating system renders text a bit differently, especially OS X. We had to add in some automatic padding for OS X to prevent wrapping text objects. Right now what we are doing is adding an automatic 3% increase when we write the markup. We just made an estimate based on some sample sites we played with where each <div> needed to be increased by 5px to properly rendered.

This maybe something we have to tweak over time, but I have not seen enough websites using this beta to make a decision on what the best number will be.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 103173 Photo


VP of Software Development
0 posts

johnvanhulst wrote:
Hi Scott,

I think the problems are interconnected. It only happens with a 10 px text. Here is the example: http://www.jvhulst.nl/coffeecuptest/index.html . You can download the VSD design there as well. The design shows the size and position of the text box correctly.

John

Thanks for the file. It actually looks like the issue is 10px with bold. If I remove the bold it works fine. I will see what we can do here.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 2174525 Photo


Registered User
3 posts

Scott, I've tried one or two things out with your beta version over the weekend. Like several of your other testers, I thought the text looked crisper, and I'm therefore positive about the changes you've made. However, the changes didn't actually influence the problem that I originally contacted you about -- i.e. unwanted line breaks when a page is viewed on a Mac. In the end, I worked around that problem by greatly over-dimensioning the text boxes. However, in an ideal world, a smarter solution is desirable, because the over-dimensioning thing implies always guessing how big you need the box to be, then testing and correcting.
To illustrate what I'm talking about, I've posted a handful of screen grabs here:
http://www.haywoodhouse.net/temp.htm
User 104702 Photo


Registered User
293 posts

Scott Swedorski wrote:
johnvanhulst wrote:
Hi Scott,

The problem is bigger... It happens with 10 px normal too, not only with bold, and I tried 13 px, and there it evident as well: the rendered text is different compared to the VSD design... Here is a new example with 10 px normal and 13 px normal: http://www.jvhulst.nl/coffeecuptest/index.html . The new VSD design can be downloaded there. Maybe it's got something to do with the automatic padding for OS X? If so, I think this is not a good solution....

John

Thanks for the file. It actually looks like the issue is 10px with bold. If I remove the bold it works fine. I will see what we can do here.
John van Hulst
User 2172720 Photo


Registered User
1 post

How is this only being worked on now? When will these fixes be made public? Websites generated with VSD look bad with this text wrapping issue. This should be a big priority.
User 187934 Photo


Senior Advisor
20,271 posts
Online Now

I'm seeing wrapping on a text box 13px non bold in FX but not IE. Tried making the text box over size but it still wraps. The weird thing is that it previews fine but shows on the live page.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 103173 Photo


VP of Software Development
0 posts

Euan Vatcher wrote:
How is this only being worked on now? When will these fixes be made public? Websites generated with VSD look bad with this text wrapping issue. This should be a big priority.

There is no specific ETA as we are still testing.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 103173 Photo


VP of Software Development
0 posts

Eric Rohloff wrote:
I'm seeing wrapping on a text box 13px non bold in FX but not IE. Tried making the text box over size but it still wraps. The weird thing is that it previews fine but shows on the live page.

What you see in VSD is not being rendered by a browser, so it will be different once the page is rendered. The issue is all browsers and operating systems render text differently so there will always be slight differences. Our goal is to make this as close as possible, but realistically it will never be 100% identical.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 187934 Photo


Senior Advisor
20,271 posts
Online Now

Maybe I wasn't clear enough. When I preview the page click "Preview" in VSD it shows fine in FX preview. The page live on the web shows wrapping in the same text box in FX browser.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 103173 Photo


VP of Software Development
0 posts

Eric Rohloff wrote:
Maybe I wasn't clear enough. When I preview the page click "Preview" in VSD it shows fine in FX preview. The page live on the web shows wrapping in the same text box in FX browser.

You got me on that one. Using Firefox locally or on the web should have identical views. I just compared a test site in Firefox locally and online and it is the same for me here.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.