• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

wyśrodkowanie przycisku

Object Storage Arubacloud
+1 głos
6,092 wizyt
pytanie zadane 1 września 2017 w HTML i CSS przez niko404 Użytkownik (910 p.)

Hej, mam mały problem, nie potrafię wyśrodkować przycisku, pomoże ktoś? 

<header>
    <div class="container">
      <h1><a href=""><img src="img/logo-tajem.png" alt="Tajam"></a></h1>
      <nav>
        <ul>
          <li><a href="">HOME</a></li>
          <li><a href="">ABOUT</a></li>
          <li><a href="">EXPERTISE</a></li>
          <li><a href="">TEAMS</a></li>
          <li><a href="">WORKS</a></li>
          <li><a href="">PEOPLE SAY</a></li>
          <li><a href="">CONTACT</a></li>
        </ul>
      </nav>
      <h2>We Are Awesome Creative Agency</h2>
      <hr>
      <p>This is Photoshop's version  of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit.</p>
      <button class="button-header">LEARN MORE</button>
    </div>
  </header>
* {
  margin: 0;
  padding: 0;
}

body {
  font-size: 14px;
  font-family: 'Roboto', sans-serif;
  box-sizing: border-box;
}

.container {
  max-width: 980px;
  margin: 0 auto;
}

button {
  color: #00e0d0;
  border: 1px solid #00e0d0;
  background: none;
  padding: 10px 15px;
  font-weight: 400;
  font-size: 16px;
  font-family: 'Hammersmith One', sans-serif;
  border-radius: 2px;
}

header {
  background-image: url('img/background-forest.png');
  background-size: cover;
  background-repeat: no-repeat;
  height: 670px;
  width: 100%;
}

.button-header {
  margin: 0 auto;
  text-align: center;
}

 

1 odpowiedź

+2 głosów
odpowiedź 1 września 2017 przez mitelak Pasjonat (23,330 p.)
wybrane 1 września 2017 przez niko404
 
Najlepsza

Do klasy .button-header dodaj display: block; wtedy margin: 0 auto; zadziała :) 

Podobne pytania

0 głosów
1 odpowiedź 347 wizyt
0 głosów
2 odpowiedzi 344 wizyt
pytanie zadane 13 sierpnia 2016 w HTML i CSS przez jankustosz1 Nałogowiec (35,880 p.)
0 głosów
3 odpowiedzi 560 wizyt
pytanie zadane 27 maja 2016 w HTML i CSS przez xmentor Nałogowiec (49,520 p.)

92,579 zapytań

141,432 odpowiedzi

319,663 komentarzy

61,964 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...