Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][HTML] Niewyświetlanie się marginesów
Forum PHP.pl > Forum > Przedszkole
Baku12345
Witam
Mam pewien problem z modelem pudełkowym w dreamweaverze. Nie wyświetlają mi się marginesy górny i dolny przy p. Umiem to naprawić, ale
z ciekawości chciałbym się dowiedzieć, dlaczego w takiej formie jak jest poniżej to nie działa.

Kod wygląda tak:

Kod
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">

body {
    margin: 0;
    }

#przyklad {
    background-color: #009;
    width: 400px;
    }
    
#przyklad p {
    background: white;
    height: 200px;
    width: 150px;
    margin: 10px auto;
    }
    
</style>
</head>

<body>

<div id="przyklad">
<p>Jakaś treść</p>
</div>

</body>
</html>


Prawidłowo strona powinna wyglądać tak:


a wygląda tak:


Proszę o odpowiedź dlaczego pomimo ustawienia margin: 10px auto; w stylach te 10px nie są brane pod uwagę.

Z góry dziękuję za odpowiedź
Maciej
-ZenekN-
Witam, jestem początkujący w tych sprawach ale wydaje mi się że brakuje ci marginesu górnego czyli padding


  1. #przyklad {
  2. background-color: #009;
  3. width: 400px;
  4. padding: 1px;
  5. }



http://jsfiddle.net/RnUaf/

pozatym:

http://haxite.org/index.php3?site=forum&am...7652&glst=1

Pozdrawiam
ZenekN
-ZenekN-
Doszukałem w profesjonalnych stronach

  1. body{
  2. padding:0px 0 20px 0;
  3. margin:0px 0 20px 0;
  4. background: #colour name;
  5. font-family: Arial;
  6. font-size: 12px;
lobopol
Wsadź sobie te profesjonalne strony ...
Najprostsze rozwiązanie http://jsfiddle.net/gArNW/
Baku12345
Brakuje marginesu ponieważ w body ustawiłem margin: 0, ale to nie istotne. Mi chodzi o ten margines w znaczniku p. Według mnie, nie wiem może się mylę,
skoro ustawiłem w #przyklad p { margin: 10px auto; }[/b], to to co jest w p powinno się ustawić na środku i mieć odstęp 10px od góry i dołu.

----------<div>---------------
| margin: 10px
----------<p>-----------------
Jakaś treść
----------</p>----------------
| margin: 10px
----------</div>--------------

tymczasem ustawia się na środku, ale 10px nie ma. Zrobiłem to właśnie na odwrót czyli ustawiłem padding: 10px dla div, ale dziwi mnie to, że nie działa kiedy
ustawiam margin: 10px dla p. Margin dla p to chyba to samo w tym przypadku co padding dla div.

lobopol to nie miała być profesjonalna strona tylko testowy przykład. Zobaczyłem że coś mi nie gra więc zapytałem
-ZenekN-
Wydaje mi się że to oczywiste że nie ma różnicy w marginesie pomiędzy tłem w tym przypadku (przykład) a jego atrybutem, ponieważ program traktuje to jaką spójną komórkę

margines to margines nie może być różny dla innych elementów w komórce inny.

Wyobraź to sobie na zasadzie drukowania dajesz odgórny margines czyli barierę nie do pokonania bo cóż miałby innego znaczyć margines ? wink.gif


Pozdrawiam i dziękuję za dociekliwość
-ZenekN-
Pozatym przypatrz się dokładniej temu projektowi występuje tam margines tylko w kolorze białym
-ZenekN-
w takim kolorze jaki nadałeś atrybut czyli biały biggrin.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.