Text Lesson - Page Width

How do I change the page width in a text lesson?

The default page displays text across the entire page. How can I make a tidy centralised column of text set to a specific width?


2 people have this question

Hi Amir,

Happy to help!

You could do that by adding some inline styling to the lesson from the HTML (<>) view of the text lesson editor.


Add the parts highlighted in yellow below around your text:

<div style="width: 80%; margin:0 auto;"><p style="text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vulputate non ligula id dapibus. Donec euismod aliquet pulvinar. Aenean at rutrum mi. Quisque cursus odio nec metus suscipit tincidunt. Donec venenatis, sem a suscipit rutrum, elit sem vehicula augue, aliquam hendrerit lectus sapien at quam. Aliquam porta sem scelerisque laoreet hendrerit. Donec magna neque, aliquet nec diam nec, fringilla molestie arcu. Maecenas ultrices facilisis libero nec dictum. Donec quam purus, mattis at fringilla vitae, venenatis sit amet sapien. In ac magna ut eros feugiat ullamcorper eu et eros. Quisque tempus erat consectetur vehicula suscipit. Maecenas eu maximus orci, vel viverra justo.</p></div>

That will make your text look like this:


You can adjust the width/alignment of the text by changing the code that you use slightly:

Adjust the width percentage (highlighted) to make the column wider/thinner:

<div style="width: 60%; margin:0 auto;"><p style="text-align: justify;">

Adjust the text-align to make the text centered, rather than centered and justified:

<div style="width: 80%; margin:0 auto;"><p style="text-align: center;">

I hope this helps!



1 person likes this

That works brilliantly - Thanks!

Very useful. Thank you