Question

0

236

Views

How to move text in a display block div

.score{
    font-size: 20px;
    text-align: center;
    background-color: white;
    width: 700px;
    height: 200px;
    border: 1px solid white;
    border-radius: 0px 0px 10px 10px;
    display: block;
    margin: 0 auto;
}
.score p span{
    padding-top: 100px;
}

    <div class="score">
        <p>bb<span id="correctAns">jkjh </span></p>
    </div>

I want to move my text down a little bit but it's not working, putting padding in .score just makes it bigger and nothing happens if I put it in .score p span.

over 4 years ago · Santiago Trujillo

2 answers

Answer question

0

Just Use `margin-top` to `p` element

Note: I have changed color to blue, for better understanding!

.score{
    font-size: 20px;
    text-align: center;
    background-color: blue;
    width: 700px;
    height: 200px;
    border: 1px solid white;
    border-radius: 0px 0px 10px 10px;
    display: block;
    margin: 0 auto;
}
p{
    margin-top: 100px;
}

<div class="score">
        <p>bb<span id="correctAns">jkjh </span></p>
    </div>

over 4 years ago · Santiago Trujillo Report

Answer question

Find remote jobs

Accepted Answer · 2022-05-19T14:58:26.238Z

Nepotech's answer is correct. An other way is useing line-height for .score:

.score {
  font-size: 20px;
  text-align: center;
  background-color: white;
  width: 700px;
  height: 200px;
  border: 1px solid white;
  border-radius: 0px 0px 10px 10px;
  display: block;
  line-height: 100px;
}

<div class="score">
  <p>bb<span id="correctAns">jkjh </span></p>
</div>

0

236

How to move text in a display block div

2 answers

0

0

Just Use margin-top to p element

Find remote jobs

Andres GPT

Just Use `margin-top` to `p` element