CODEWITHSUNDEEP
javascripthtmlcss
studentinneed77
studentinneed77

Reputation: 7

Centering text outputted from a button click

so I'm new to web development (very new) and I have a small project to work on. The user clicks a button (everything on the webpage is already centered, including the button), and the button returns some text. it is very similar to this code

function myFunction() {
    document.getElementById("demo").innerHTML = "Hello World";
}
<p>Click the button to trigger a function that will output "Hello 
World" in a p element with id="demo".</p>

<button onclick="myFunction()">Click me</button>
<p id="demo"></p>

What i am trying to do is have the output (Hello world) be centered on the page as well. In my original code, however, the output is an array of words ( a sentence). I want to learn how to center it.

I'm sorry if this isn't formatted properly, I'm new to stackoverflow as well. Any help would be appreciated. Thanks!

Upvotes: 0

Views: 36

Answers (1)

Julio Feferman
Julio Feferman

Reputation: 2664

Use text-align:center

function myFunction() {
    document.getElementById("demo").innerHTML = "Hello World";
}
#demo {
  text-align:center;
}
<p>Click the button to trigger a function that will output "Hello 
World" in a p element with id="demo".</p>

<button onclick="myFunction()">Click me</button>

<p id="demo"></p>

Upvotes: 1

Related Questions