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

question-closed Odległość między elementami blokowymi

Object Storage Arubacloud
0 głosów
689 wizyt
pytanie zadane 21 maja 2017 w HTML i CSS przez niezalogowany
zamknięte 21 maja 2017

Witam. Chciałbym się dowiedzieć jaki jest najlepszy sposób na zmniejszenie odległości pomiędzy znacznikiem <h1> a <p>, czy pozostaje mi ustawić margin. ? kod poniżej 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- <META name=”Description” content=”opis strony adekwatny do jej zawartości”> -->
  <title>Liverpool FC - Season 16/17</title>
  <link rel="stylesheet" href="style.css">
  <link href="https://fonts.googleapis.com/css?family=Lora" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Cinzel:700" rel="stylesheet">
  </head>
<body>
<div id="header">
    
</div>
<div id="main">
    <div id="mane-debut"><div id="picture"><img id="sadio" src="images/Sadio%20Man%C3%A9%20-%20Liverpool.png"/></div><div id="describe"><h1 class="section-titles">Sadio Mane debut</h1><p>31 august<p></div>
    </div>
    <div id="firmino-performance"><h1 class="section-titles">Firmino performances</h1><img id="firmino" src="images/roberto-firmino.png"></div>
    <div id="lallana-playeroftheyear"><img id="lallana" src="images/adam-lallana.png"><h1 class="section-titles">England Player Of The Year</h1></div>
</div>
    </body>
body
{
    background-color: #A52E2C;
    margin: 0;
}


#main
{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    height: 3000px;
}

#mane-debut
{
    display: flex;
    width: 100%;
    background-color: aqua;
}

#picture
{
    display: flex;
    background-color: sandybrown;
}

#sadio
{
    width: 240px;
    height: 630px;
}

#describe
{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: cornflowerblue;
}

#firmino-performance
{
    display: flex;
    width: 100%;
    background-color: cadetblue;
    justify-content: flex-end;
}

#lallana-playeroftheyear
{
    display: flex;
    width: 100%;
    justify-content: flex-start;
    background-color: darkorange;
    
}

.section-titles
{
    font-family: 'Cinzel', serif;
    color: #D9D9DB;
    letter-spacing: 6px;
}

 

komentarz zamknięcia: pr

1 odpowiedź

0 głosów
odpowiedź 21 maja 2017 przez niezalogowany
 
Najlepsza

Odległości te są ustawione przez margin, najlepszym sposobem jest zmiana właśnie tej wartości

komentarz 21 maja 2017 przez niezalogowany
Dzięki za odpowiedź.

Podobne pytania

0 głosów
1 odpowiedź 491 wizyt
+5 głosów
5 odpowiedzi 7,853 wizyt
pytanie zadane 11 kwietnia 2015 w HTML i CSS przez Emilian Kuczyński Użytkownik (670 p.)
+1 głos
0 odpowiedzi 723 wizyt
pytanie zadane 10 stycznia 2022 w C i C++ przez jagfoljersolen Początkujący (250 p.)

92,555 zapytań

141,403 odpowiedzi

319,554 komentarzy

61,939 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!

...