How I can put text in center

Question

I'm try create simple website for improve my skills in HTML and CSS languages but I don't know how to put this text in center please check image below

Preview image

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
}

.orange {
  width: 50%;
  height: 100%;
  background-color: #f5a130;
  background-size: cover;
  float: left;
}

.black {
  width: 50%;
  height: 100%;
  background-color: #383838;
  background-size: cover;
  float: right;
}

.title {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  color: #454;
  text-align: center;
  letter-spacing: 20px;
}

<body>

  <div class="orange"></div>

  <div class="black"></div>

  <h1 class="title">TEST WEBSITE</h1>

</body>

I tried use text-align but It's go to bottom

no need extra element if you want to have such background; check this : https://stackoverflow.com/a/48074187/8620333 — Temani Afif, Mar 25 '19 at 22:52

score 1 · Accepted Answer · answered Mar 25 '19 at 23:36

you should work with positions relative and absolute so you can control it i added : .title { position:relative; bottom:50%;}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
}

.orange {
  width: 50%;
  height: 100%;
  background-color: #f5a130;
  background-size: cover;
  float: left;
}

.black {
  width: 50%;
  height: 100%;
  background-color: #383838;
  background-size: cover;
  float: right;
}

.title {
position:relative;
bottom:50%;
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  color: #454;
  text-align: center;
  letter-spacing: 20px;
}

<body>

  <div class="orange"></div>

  <div class="black"></div>

  <h1 class="title">TEST WEBSITE</h1>

</body>

i hope thats what you want – godfather Mar 25 '19 at 23:36 — godfather, Mar 25 '19 at 23:36

How I can put text in center

1 Answers1