My friend wanted me to edit her site so that it matched perfectly how she designed it in the Wordpress Visual Edit window.
The picture/text alignment that looks perfect to her when she uses the Visual Edit window is slightly off on the actual site.
I still think it looks very good but it’s not perfect like she wants it to be. So I counted several times & found that the
Visual Edit window is set at 100 characters per line while her site is actually at 115 characters per line- hence the discrepancy.
So how do we set the actual page at 100/line? We’re using WordPress 4.9.8
Are you sure the page isn’t dynamic? If it is, then changing the size of the window will change the line width. And that is the general goal of website. And that is generally considered best practice in website design.
Other than that, all I can recommend is either putting the text in a box that is the correct width, or enlarging the text.
I don’t think it is dynamic but I don’t know. I try to find answers about reconciling the site with the Visual Editor & I see articles about messing with CSS.
This is uh, well, you’re asking for something. To put it plainly, websites can and should be dynamic, and they should be able to operate under a hundred different instances and still come out legible. That she is attempting to make the visual editor match the page exactly is not going to happen on anything other than her own personal machine and any other machine that matches those specifications. If she’s there trying to make exactly 5 specific lines of text line up to an inline photo exactly, that’s uh, something. It won’t be the same lines of text if the browser window shrinks and the page responds (and if the page doesn’t respond your website is badly made), it won’t be the same lines of text on mobile, and it won’t be the same lines of text on a different photograph that has different dimensions, or if you add italics, or basically anything. So she needs to stop trying or think of a different way to present the material. For example, if specific text has to be associated with a photograph, I’d recommend a caption that is tied to the photograph and will go wherever the photo goes.
If you force the div the text is inside on the webpage to be wider to match the visual editor using CSS, there is a nonzero chance it will cause a visual cascade failure on the website layout and the whole thing will break in new and interesting ways as divs go out of bounds of the wrapper dimensions. It’s possible the theme is constructed in a way that makes it possible, but it’s unlikely. Look through appearance customization options to see if there is anything that desginates the width of the main blog area - if there is any way to change it for a newbie without breaking the whole thing, it’s going to be there.
Also, for reference, if it’s really the width that’s simply shifting some words to the next line, using the link provided earlier will not fix this as the wordpress CMS is also responsive. That fix you linked will make all the text styles match, but the width of the visual editor is determined by the browser window. Try it out. Just make the browser window half the width or smaller than you were working with before while having the post edit page open. Suddenly your editor window is much smaller and will shift everything as needed. I hope this illustrates why it’s a rather hopeless thing to try and fix. This is intended design, so that a website can work with a thousand different electronic devices without breaking.
Been away from here for a few days, I just wanted to thank BigT & Macca26. You didn’t tell me what I wanted to hear but you did tell me what I needed to hear.
