How to change onclick text's position? - html

Question

Hi guys so I'm new to all this html stuff.
Basically;
http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onclick
When i do this the text shows up under the button. I want it next to the button (right)
How can i do that?

Answer 1

I'm afraid you need to spend a bit more time learning about this. Realistically you'll need to use CSS to style the HTML that is output by your Javascript.
Both CodeSchool and Codecademy have great tutorials on learning the basics of HTML, CSS and Javascript. You'll need to learn these basics if you want to do this sort of thing yourself.
https://www.codeschool.com/
https://www.codecademy.com/
I've copied your example into a CodePen, which helps to show you the roles played by HTML, CSS and Javascript. As an example, the CSS could be;
http://codepen.io/tombeynon/pen/rVQvMO
button{
float:left;
margin-right:5px;
}
#demo{
float:left;
}

Answer 2

Add display:inline-block to p tag
Try this.
<button onclick="myFunction()">Click me</button>
<p id="demo" style="display:inline-block"></p>
Fiddle:https://jsfiddle.net/9yqs14p4/

Answer 3

First of all you have to know, that in HTML there are inline elements, e.g <span> and block elements, e.g <div>. That means, what the word says.
You can test the difference:
// block
<div>div1</div>
<div>div2</div>
// inline
<span>span1</span><span>span2</span>
In the example is used the <p> tag which is a block element. Therefore
you see the text below.
<button> is an inline element. If you simply use a span:
<span id="demo"></span>
it works!