Hi Ryan,

You may want to try out different values other than 1.25 - you can select "Multiple" from the Paragraph Spacing dialog and enter any value in there. I tested out a few and 1.1 looks pretty much the same as Single line spacing from X.6. Test out 1.14 as well - that generally looks good for most fonts.

If you decide to go back to X.6 you'll want to export your title to XML (File > Export > XML) and then from X.6, import the XML.

Again, I apologize for the issues you're encountering! Let me know which solution ends up working for you.

Thanks,

Laura

Hi Laura, thanks for getting back to me on this. Is there any workaround for this? Is there no way for me to publish my title and keep the paragraph spacing? I've noticed that I can edit my course to use 1.25 line spacing, however it takes up a lot of space in the tool and looks completely normal in the browser window. Since 1.25 line spacing takes up so much space in the tool, it's not really a viable solution.

My client is finding the text very hard to read, and we've tried a few fonts. It's all about the tight spacing.

Can you tell me if v11 is backwards compatible with X.6? If so, I may have to revert back to the previous version.

cheers,

Ryan

Hi rfullterton,

Lectora v11 changed over to the HTML 5 doctype, and this did in fact affect the line height for text once published to HTML. Every attempt was made to keep the line heights the same between vX and v11, but yes, there is a small difference.

I apologize for the confusion.

Thanks,

Laura

Mbards,

Any changes made to line spacing in v11 were done out of an effort to make the Editor and published content more consistent. These changes were tested with a variation of styles and sizes, on all supported browsers.

Can you tell me more about the issue you're seeing on your end? Are you using a specific font style and font size? In what browser are you seeing these differences? Any details you can provide will be helpful, and if you can upload some screenshots for us, that would also be great.

I sincerely apologize for your frustration and will do all I can to help.

Thanks.

Laura

Hi Laura,

I'm having the same problem as Ryan and finding it really frustrating. I can't believe this wasn't put right in testing before release as it's a major flaw. For the line spacing not to look the same in the editor as it does when published is just bizarre and makes page layout considerations much more difficult... are there no plans for an upgrade to put this right? I'm seriously considering switching to another publishing tool on the back of this.

Hi Laura,

Thanks for getting back to me so quickly. The type face I'm using is Verdana 10 pt with 1.25 line spacing. The browser our organisation uses is IE 7. I appreciate this is an old browser and we are due to upgrade soon but I've seen a published title on a colleague’s PC that uses IE 8 and the problem with the line spacing doesn't appear to be any different. A solution to this would be gratefully received as I've always found Lectora to be an excellent authoring tool and the rest of the upgrades to version 11 have definitely enhanced the product, but this issue with paragraph spacing causes major problems for page layout.

I've attached two screen shot as requested though they are a tad pixelated due to the size restrictions for forum attachments.

Regards

Mark

Hi Mark,

I can definitely see the difference, and I'll do my best to offer an explanation and some suggestions that you will hopefully find helpful.

As I've mentioned, in v11, Lectora changed over to the HTML 5 doctype and changes were put in to make the text in the Editor and the published content more consistent. The issue is that every browser renders text differently, and to keep text consistent across all browsers is quite a challenge. What looks one way in Chrome looks very different in IE, and so "fixing" text for one browser would just "break" it somewhere else.

Also, text is a bit different than other elements of a page because it flows from line to line - the positions aren't static. Unfortunately, as a result, a 1px difference in line height can become a 2 line difference once you're up to 30 lines of text.

My recommendation for your particular example is to embed the image in the text block - you can do this by editing the text block, placing your cursor where you want to add the image, and then from the right-click menu, select Insert > Image. I've attached a screenshot of how this looks for Verdana 10, 1.25 line spacing, in IE vs. Lectora. This method enables the image to flow with the text, so they're always in line with each other.

Another idea, although I wouldn't recommend this for every page, is to render the text as an image (select "Convert to Image" in the text block's properties).

Finally, one rule of thumb to keep in mind is that text set at line spacing greater than 1 will generally grow longer rather than shrink once published, so keeping a bit of room at the end will help account for any differences.

I hope these suggestions work for you, and I hope you'll continue to use Lectora 11.

Thanks,

Laura

Hi Ryan,

I'd like to take a closer look at your title to see if I can narrow down the issue and if a bug needs to be documented. Can you export the title to a ZIP file and send to support@trivantis.com and place "Attn: Laura" in the subject line?

If the title is too large you can make a copy and strip out any non-relevant pages.

Thanks,

Laura

Hi Laura, we ended up deciding to switch back to Lectora X.6 for this client. I used your recommendation of exporting and importing the XML file and everything moved over and is working in X.6. However, and I know this might not be relative to this forum, but the one issue I am now having now is with buttons or links that open a Web 2.0 style window are now opening 2 windows on top of each other. They will open a New Browser Window normally, it's just the 2.0 style that we now have an issue with. I have tried setting all the links to New Browser window and then switching them back with no luck. I have also selected the Use Publish Option and selected the Web 2.0 style popups from the publish settings without luck.

Have you heard of this issue? It wasn't an issue until the course title went into v11 and then back to X.6. I can't think of anything in the title itself that would cause the links and buttons to open 2 "web style 2.0" windows on top of each other.

Also, please let me know if you would like me to post this issue somewhere else in this forum.

cheers,

Ryan

I was trying to figure out what is wrong with my title and now I see this is it. Please fix this. I am finding Lectora 11 unusable.

I came up with a fix using CSS that seems to work in FireFox and Chrome so far (doesn't work in IE 9). I tried adding an attachment to the discussion board, but no Add Files button appears on my screen. I tried sharing to the Lectora Online Library but it's not showing up. So to create this yourself, create a file in Notepad with these lines:

div[id^="text"] span {

line-height: 114%;

}[/CODE]

Save as a CSS file.

Then insert an HTML extension and select Cascading Style Sheet for type. Browse to select the CSS file you created, then add as an additional file as well.

Edit: When viewed on an iPad, the line-height is slightly greater, so be careful if you have multiple text blocks and photos real close to each other.[CODE]div[id^="text"] span {

line-height: 114%;

}[/CODE]

Save as a CSS file.

Then insert an HTML extension and select Cascading Style Sheet for type. Browse to select the CSS file you created, then add as an additional file as well.

Edit: When viewed on an iPad, the line-height is slightly greater, so be careful if you have multiple text blocks and photos real close to each other.

Hi i'm having a similar but slightly different issue. We upgraded to V11 only yesterday (which was a bad idea being in the middle of a design project). My issue is involving the Menu functionality in Lectora Inspire. Probably due to the font spacing issue you mention above, the menus are looking very messy and unaligned.

For example, I have a menu running down the left side of every page of evey module i'm developing. It has a fixed width of 92 pix and a set margin for consistancy purposes. In a browser (IE8) V11 automatically pushes the Menu to the right a few pixels which makes the menu overlap onto my content. However, menu items over a specific text length have moved left.

I also have an issue with the sub-menu items. Once over a specific text length, the sub-menu item drops the last word or two of the sub-menu and creates a small amount of extra space between thsi item and the next, without showing anything there. Very strange.

I've had to reinstall my previous version (X4) to get around this. Any workaround or suggestions for this?

I noticed menu issues too. I use them on single pages to separate content. When someone browses through the menu, a small diamond appears to the left of the currently selected menu item. When I publish in Lectora 11, these diamonds end up overlapping the menu items. The CSS code I posted above does not fix this. Moving the menu over 5 pixels to the right solves this, but it means the menu and content are now a little closer together. The problem is that Lectora does not display things the same way it does when published. This makes it difficult to know where to place stuff on the page.

Was there an update? It is behaving differently now, but still not displaying correctly in all browsers. I had to remove my CSS code as it was making it worse now. Everything seems to display correctly in FireFox, but Chrome is still squeezing lines together. IE is not displaying the lines correctly at all; after the 5th line, the words at the beginning of each sentence end up being different from how it is displayed in Lectora. It’s a little closer to the paragraph height in the Lectora viewer, but it seems this is due to greater spacing between the letters.

LauraM: I tried responding to your email, but it's not working.

Edit: Actually FireFox is still squeezing text in my title, just not in a new title I created. Not sure what is different. Either way, all my titles display text differently depending on the browser.

@rwalters 49619 wrote:

LauraM: I tried responding to your email, but it's not working.

Please send a zipped copy of your AWT folder to support@trivantis.com to my attention. I would like to see the issue you've referenced regarding menu items.

We appreciate your help.

Thanks,

Laura

I sent the file containing the menu item issue. I had to send it from a different email address(it contains my name) because our server blocks all zip file attachments.

As for my paragraph spacing, I discovered that including jquery in my title is causing differences in the paragraph spacing. I occasionally use jquery and I'm uncertain how many titles I will have to change if I can't use jquery. Is it not compatible with Lectora 11? It worked great in Lectora X and is commonly used by many web developers.

However, the IE and Chrome problem described above is an issue even when jquery is removed from the title.

I am using a 2 paragraph text block that is 477 pixels in height. I copied the text block and made this second one convert to an image. No jquery.

FireFox: Paragraph height is close, about 3/4 of a line (of text) shorter than the image. The horizontal spacing of letters is not affected.

Chrome: Vertical spacing is noticeably narrower, losing nearly 2 lines of text in comparative height. The horizontal spacing of letters is not affected.

IE9: Loses about the same amount of vertical space as FireFox, about 3/4 of a line. However the vertical spacing is narrower; instead, the horizontal spacing between letters is greater. This results in the last line of the paragraph containing the last 5 words, rather than only the last two words.

Here's a perfect example of the issue...

[ATTACH=CONFIG]424[/ATTACH]

In Lectora 11, it looks fine, but when published to HTML, it becomes unusable.

I discovered that if I go through the ENTIRE course (500+ pages) an change each individual text box from "HTML Text Type- Heading 1

" to "Normal" it resolves itself. Granted, these were "Normal" in the Lectora 10 version, but apparently moving to Inspire changed this.

In my opinion, this is another fairly significant oversight. I understand the need to move to a standardized HTMLtype, but you could have at least had a function where when a legacy (Lectora10) course was opened, it made concessions.

Oh - and what's up with the TINY image size allowed on this board?? Jeesh!

Joe

Still loves Lectora, but for the next couple of nights, Lectora is sleeping on the couch.

Here is one thing in my findings. I have installed a copy of Lectora X just to see the line spacing difference in them.

This is the HTML code from a SCORM publish in Lectora X:

Notice the default line-height is 1.156.

Not this is the SAME AWT file when opened on Lectora 11 and published with the same settings:

This is the SAME line of code. In Lectora 11 the default line-height is set to .938

As a test I did this:

I published my course using Lectora 11.

I used a search and replace program. I searched for 0.938 and replaced them all with 1.156.

I uploaded the course to my LMS and it looks good now, just like it used to with Lectora X.

Hope this helps.

We were having line-height issues and a problem with how HTML5 renders text - it was causing displacement with our text blocks that weren't visible until it was published to html and viewed in the actual browser.

We decided to force the DOCTYPE to use 4.01 Transitional instead of HTML 5, which corrected the text problem.

That created issues with how our paragraphs were spacing, so we added an onLoad event to the browser when the document loaded that targeted all

elements and reset the line-height to 'normal' or just a null entry, " " . This executes after all the Lectora based scripting, thus avoiding any interference with those functions. This will also allow you to set your own default line-height to whatever you wish ( We just decided to reset it to use the browser default, for now ).

Set it as a 'top of file scripting' HTML object, and it does the trick.

The code is unpolished and it obviously has some potential complications, but I decided it was worth posting in case it helped anyone out:

[/CODE]

Also, here is a good read on line-height from MDN:[URL="https://developer.mozilla.org/en-US/docs/Web/CSS/line-height"]line-height[/URL]

This excerpt especially:

em values and line-heights have poor inheritance behavior, and should almost never be used in practice. Stick to unitless line-heights (such as "1.1").

"http://www.w3.org/TR/html4/loose.dtd">

[/CODE]

Also, here is a good read on line-height from MDN:line-height

This excerpt especially:

em values and line-heights have poor inheritance behavior, and should almost never be used in practice. Stick to unitless line-heights (such as "1.1").

The problem seems solved. I have started using 1.25 line height as it looks easier to read in all browsers anyway. But on a test, the answers will have extra tight line spacing even at 1.25. I end up having to set it to 1.5 just to get something readable. What is going on here? I have even tried disinheriting everything on the page, so it doesn't seem like it's anything I'm adding to it.