Witam. Robię sobie stronę internetową, by poćwiczyć html i css.
Wszystko szło mi dobrze, do czasu.
Jeden z div-ów wyświetla mi tekst, ale nie tam gdzie powinien, tzn. div ma wysokości 150px (ładne tło obrazkowe itp.) a tekst wyświetla się na wysokości ok. 200 px i jest przykryty przez inny div.
Można powiedzieć, że tekst się “zbuntował” i nie chce być wyświetlany na tle.
Nie wiem, czy mam błąd w html, czy w css (być może mam źle rozmieszczone div-y w html-u).
Zamieszczam kod ze styli kaskadowych:
body {
background: url(images/tlo.jpg) repeat;
background-color: #3b4113;
margin-top:0px;
margin-left:auto;
margin-right:auto;
margin-bottom:0px;
width:1024px;
list-style: none;
}
div {
font: Verdana 12px #000;
position: relative;
}
a {
text-decoration: none;
}
#kontener {
width: 1024px;
height: 100%;
border-left: solid #34381d 2px;
border-right: solid #34381d 2px;
background: #3b4113;
}
#naglowek {
float: left;
background: #fff url(images/logo1.jpg) no-repeat;
width: 250px;
height: 193px;
}
#logo {
float:right;
background: #fff url(images/logo.jpg) no-repeat;
width: 774px;
height:193px;
}
#belka{
position: relative; top: 193px;
background: #fff url(images/belka.jpg) repeat;
width: 250px;
}
#tytul{
display: block;
position: relative; left: 250px;
text-align: center;
background: #fff url(images/tlo_tekst_top.jpg) no-repeat;
margin-left:auto;
margin-right:auto;
padding-top: 50px;
padding-left: 20px;
width: 754px;
height: 100px;
}
#tresc {
display: block;
position: relative; left: 250px;
min-height: 220px;
margin-left:auto;
margin-right:auto;
padding-left: 20px;
background: #fff url(images/tlo_tekst_mid.jpg) repeat;
width: 754px;
}
#koniec{
display: block;
position: relative; left: 250px;
text-align: center;
margin-left:auto;
margin-right:auto;
padding-left: 20px;
background: #fff url(images/tlo_tekst_bot.jpg) no-repeat;
width: 754px;
height: 150px;
}
#stopka{
background: #3b4113 url(images/stopka.jpg) no-repeat;
text-align: center;
width: 1024px;
height: 35px;
}
oraz z html-a:
Tekst tytułu
To jest przykładowy tekst, który będzie wyświetlany jako treść strony www. To jest przykładowy tekst, który będzie wyświetlany jako treść strony www. (…)
Koniec
Stopka
[/code]
Wszystko wyświetla się ładnie, ale mam problem z tym nieszczęsnym div-em “tytul”, którego dotyczy cały temat.
Aha, i proszę o wyrozumiałość, jestem początkujący i nie do końca jeszcze wiem co i jak.
