26-10-2011, 02:27
Witam
Proszę o pomoc z następującym problemem. Chciałbym zrobić pod sobą 2 bloki <div> w tym na górze baner w tym niżej taki pasek. Problem tkwi w tym, że wydawało mi się, że blok automatycznie jest wielkości umieszczonego w nim obiektu(tu obrazka). Przedstawiam screena tego co udało mi się uzyskać:
http://img810.imageshack.us/img810/7412/problemvy.png
Jak widać pod obrazkiem w bloku robi się odstęp, którego nie chcę. Wiem, że mogę ustawić wysokość na sztywno dla bloku ale chciałbym bardziej zrozumieć ich naturę i dlaczego tak się dzieje. Od razu mówię, że margin i padding mam ustawione na 0.
Poniżej zmieszczam kod:
Wszelkie uwagi apropo tego kodu mile widziane. Z góry dzięki :]
Proszę o pomoc z następującym problemem. Chciałbym zrobić pod sobą 2 bloki <div> w tym na górze baner w tym niżej taki pasek. Problem tkwi w tym, że wydawało mi się, że blok automatycznie jest wielkości umieszczonego w nim obiektu(tu obrazka). Przedstawiam screena tego co udało mi się uzyskać:
http://img810.imageshack.us/img810/7412/problemvy.png
Jak widać pod obrazkiem w bloku robi się odstęp, którego nie chcę. Wiem, że mogę ustawić wysokość na sztywno dla bloku ale chciałbym bardziej zrozumieć ich naturę i dlaczego tak się dzieje. Od razu mówię, że margin i padding mam ustawione na 0.
Poniżej zmieszczam kod:
Cytat:styl.css
@charset "UTF-8";
body
{
margin: 0px;
padding:0;px
}
div[id="strona"]
{
background-color: #DADADA;
}
div[id="baner"]
{
display:block;
text-align:center;
background-color:pink;
}
div[id="pasek_gora"]
{
display:block;
text-align:center;
background-color:red;
}
Cytat:index.html
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<title>eKożuszki</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="./style/styl.css"/>
</head>
<body>
<div id="strona">
<div id="baner">
<img src="./img/baner.jpg" alt="eKożuszki" />
</div>
<div id="pasek_gora">
<img src="./img/menu.jpg" alt="eKożuszki" />
</div>
</div>
</body>
</html>
Wszelkie uwagi apropo tego kodu mile widziane. Z góry dzięki :]
