How to horizontally center text(h2)? I have problems

Question

I have some trouble with getting text centering in my website, for some reason. I need the text to be exactly centered in the website, both computer and website.

.bg { 
    background: url(https://i.imgur.com/HrC81SX.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    background-size: cover;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    -webkit-filter: blur(5px);
    filter: blur(5px);
  }

#cs {
    display: block;
    text-align: center;
    font-family: 'Times New Roman';
    position: absolute;
    color: #EFE4D9;
}

#text {
    text-align: left;
}

<div class="bg"></div>
<h1 id="cs" style="text-align: center;">C O M I N G&nbsp;&nbsp;&nbsp;S O O N</h1>
<p id="text">such's movie room is on it's way through the development, just stay tuned! C:<br>- such <3</p>

Remove the position absolute – Paulie_D Apr 18 '20 at 19:24 — Paulie_D, Apr 18 '20 at 19:24

score 0 · Accepted Answer · answered Apr 18 '20 at 19:25

.bg { 
    background: url(https://i.imgur.com/HrC81SX.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    background-size: cover;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    -webkit-filter: blur(5px);
    filter: blur(5px);
    z-index:0;
  }

#cs {
    display: block;
    text-align: center;
    font-family: 'Times New Roman';
    position: relative;
    color: #EFE4D9;  
}

#text {
  position: relative;
}

This one worked! Just 1 line, and that is it! Thank you! C: – rixchy_ Apr 18 '20 at 19:37 — rixchy_, Apr 18 '20 at 19:37

score -1 · Answer 2 · answered Apr 18 '20 at 19:27

Try this:

.bg { 
    background: url(https://i.imgur.com/HrC81SX.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    background-size: cover;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    -webkit-filter: blur(5px);
    filter: blur(5px);
    z-index:0;
  }

#cs {
    display: block;
    text-align: center;
    font-family: 'Times New Roman';
    position: relative;
    color: #EFE4D9;  
}

#text {
  position: relative;
}

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="styles.css">
    </head>
    <body>
        <div class="bg"></div>
        <h1 id="cs" style="text-align: center;">C O M I N G&nbsp;&nbsp;&nbsp;S O O N</h1>
        <p id="text">such's movie room is on it's way through the development, just stay tuned! C:<br>- such <3</p>
        <!--a countdown should be here-->
    </body>
</html>

why downvote in my answer? what's wrong in this answer? – Sheri Apr 18 '20 at 20:17 — Sheri, Apr 18 '20 at 20:17

How to horizontally center text(h2)? I have problems

2 Answers2