-2

I simply just want to center my

while changing the width

this is my html code

<section class="sss">
        <div class="s-footer">
            <h3>Like what you see?</h3>
            <p>Hire me</p>
        </div>

        <div class="nav-footer">
            
            <nav class="list">
                <ul>
                    <li><a href="#">My work</a></li>
                    <li><a href="#">My skills</a></li>
                    <li><a href="#">Hire me</a></li>
                </ul>
            </nav>

            <a href="index.html" class="logo-2">Alkhazriji</a>
        </div>
    </section>

my css code inside the media query

.s-footer p
    {
        display: block;
        width: 50%;
        text-align: center;
    }

before the media query

.s-footer p
{
    background: #852EF8;
    border-radius: 50px;
    margin: 0 5em;
    font-size: 1.5em;
    width: 33.33;
    font-weight: bold;
    color: #FF57E9;
    cursor: pointer;
    display: block;
    position: relative;
}

.sss
{
    padding-top: 0;
    margin-top: 0;
    display: block;
    padding: 0;
}

i tried everything its usually centered but when i change the width it goes to the left side i tried text align, postion, grid, display, nothing worked. (im new to coding so my problem might seem stupid)

saud
  • 21
  • 6
  • can you explain a bit more about your issue?? Your text is centered perfectly within `width:50%`. May be because of other css code you are having issue – Sayog Apr 10 '21 at 16:59
  • i added more css code related to the same problem – saud Apr 10 '21 at 17:13

1 Answers1

1

Are you looking for margin?

.s-footer p
    {
       display: block;
       width: 50%;
       text-align: center;
       margin: 0 auto;
   }

'margin: 0 auto' will make your div block centered, and you are free to change the width to whatever size you want.

SequenceToSequence
  • 514
  • 3
  • 11