Please help me understand width

HTML-CSS
#1

edit: i’v managed
its supposed to be % and not px

This is my CSS:

#main-headings {
color :green;
margin: 0 auto;
text-align: center;
line-height: 80%;
}

and it looks something like this:
she codes;

Super hero league

(can’t add pic)

Why when i add " width:100px ;" to the code,
it becomes

image
image795×289 40 KB

(become 2\3 lines)?

#2

would have to see the code to know for sure, at a guess the width is going to the parent container holding the text. by setting it to 100px it forces the content to go into multiple lines.

post a link to code pen and I will be able to tell you with certainty what is going on

#3

My guess is your container is 100px wide and since multiple words cannot fit within 100px,. it then goes to the next line.

You either make the div wider., or place a wrapper element around the part you dont want to wrap.

<div class="nowrap">PLACE_THE_TEXT_YOU_DONT_WANT_TO_WRAP_HERE</div>

.nowrap {
     white-space: nowrap;
}
#4