All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

HTML Space Between Words On Same Line

Last Updated : Mar 11, 2024

HTML Space Between Words On Same Line

In this tutorial we will show you the solution of HTML space between words on same line, there are many ways with the help of which you are able to give space in HTML.

Mostly, when you want to give space in text of any tag. By mostly space is given by leaving a margin between words in html codes. But, this did not works properly.

When you open the code in browser, then a little space is showed there. Whereas the custom space gets consumed.

So, today our topic is about that how we are able to give space between words that are in same line in html.

Step By Step Guide On HTML Space Between Words On Same Line :-

As, we already say that there are many ways with the help of which you are able to give space. The most used methods by beginners is by using pre tag, but that’s not an appropriate way to give space.

The most appropriate method to give space is by using word-spacing. The word spacing tag can be used in any tag, in which the tag contains text and you want to give space in between words.

 <!DOCTYPE html>
 <html lang="en">
 <head>
 <meta charset="UTF-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Document</title>
</head>
<body>
<p style="word-spacing: normal;">
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo praesentium culpa, ea ullam perferendis aspernatur maxime et nobis iste debitis!
    </p>
    <br><br>
    <p style="word-spacing: 40px;">
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo praesentium culpa, ea ullam perferendis aspernatur maxime et nobis iste debitis!
    </p>
    <br><br>
    <p style="word-spacing: 18ch;">
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo praesentium culpa, ea ullam perferendis aspernatur maxime et nobis iste debitis!
    </p>
</body>
</html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
  4. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
  5. Here, we create three paragraphs, in all we give word-spacing in style attribute. In all the word-spacing we give different values, you can use them according to your choice. As how much space you want. You can understand the amount of space given, by customizing the value of properties.
  6. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

At last, here we specify the most used method in html that are used to give space in html in between words.

So, here we give a task you to make a tree with help of word spacing attribute and the words use here is tree, you can use this word, as much as times you want.

I hope this tutorial on HTML space between words on same line helps you.

Author Image About Dikshita

Passionate Electronics and Communication Engineering student with expertise in web development (HTML, CSS, JS,PHP, Bootstrap, React.js) and content writing. Eager problem solver and tech enthusiast, adept at creating engaging web experiences.

Follow Dikshita On Linkedin 🡪