Bootstrap not working

I’ve just got all the functionality working in my local weather project - and now I can’t put a button where I want it to go.

Bootstrap is loaded in my pen, all elements are nested in a ‘container-fluid’ element yet I can’t get 2 elements to go side-by-side.

Here is my weather project pen. There is a button under the temperature element. I want that button to be beside the temperature.

Can anyone see the problem?

Thanks

Give temp and tempButton display property of inline-block.

You may want to round to fewer decimal places, as an aside.

Thanks @icartusacrimea

Do you mean this?

#tempButton{
    display:inline-block;
}

I will try but would also love to know why bootstrap isn’t working.

Bootstrap isn’t magic. You have to actually use the grid system. https://getbootstrap.com/css/
But yes, to get those two elements on the same line, you could also just add display: inline-block to both p id temp and button id tempButton.

I cleaned up your code.
You need to use triple backticks to post code to the forum.
See this post for details.

Your app looks great :thumbsup:

@PortableStick: I agree, your app looks great! I like the changes you made since yesterday.