Ask coding questions

← Back to all posts
How can I align the colored letters on the same line ?
Bonhomme222 (0)

Hello !
I want to align this colored letters but I don't know how. In fact, I want the letters to be on the same line. However, when I run the code, each letter is on her own line. Therefore I want the word "rainbow" to be printed correctly.
I hope you will be able to help me.

Here is my code:

<p> <h3 style="color: red;">R</h3><h3 style="color: orange;">a</h3><h3 style="color: yellow;">i</h3><h3 style="color: green;">n</h3><h3 style="color: blue;">b</h3><h3 style="color: purple;">ow</h3> </p>

Here is the result of the code when I run it:

Answered by CosmicBear (56) [earned 5 cycles]
View Answer
CosmicBear (56)

Use <span> for inline html. <h3>, like all headers make anything after it on a new line.

<p><h3><span style="color:red;">R</span><span style="color:orange;">a</span><span style="color:yellow;">i</span><span style="color:green;">n</span><span style="color:blue;">b</span><span style="color:purple;">ow</span></h3></p>