Jump to content

Archived

This topic is now archived and is closed to further replies.

Guest

XHTML + CSS - jak zrobić prosty szablon?

Recommended Posts

Chciałbym zrobić najprostszy możliwy szablon oparty o xhtml: divy i css. Niestety pojawiło się kilka drobnych komplikacji - za pomoc z góry dziękuję.

Tak wygląda kod CSS, jaki chcę użyć:

html, body {
    background-color: #fff;
    color: #000;
    margin: 0;
    padding: 0;
}

#top {
    width: 780px;
}

#naglowek {
    background-color: #888;
}

#menu {
    width: 150px;
    float: right;
    overflow: hidden;
    background-color: #ccc;
}

#tresc {
    width: 630px;
    float: left;
    overflow: hidden;
    background-color: #fff;
}

#stopka {
    clear: both;
    width: 100%;
    background-color: #888;
}

Oto kod html, jaki sam stworzyłem do tego css, ale mimo to coś nie tak wyszło - całość powinna być wycentrowana, a menu nie łączy się u góry z nagłówkiem (patrz screen KLIK!)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
   <meta name="Description" content="vantage /home/" />
   <meta http-equiv="Content-Language" content="pl" />
   <meta name="author" content="Adam R."/>

   <script type="text/javascript" src="tabber.js"></script>
   <link rel="Stylesheet" type="text/css" href="style.css" />

</head>
<body>


    <div id="top">

<div id="naglowek">
<p>logo</p>
</div>

<div id="tresc">tresc * tresc * tresc * tresc * tresc * tresc * tresc * tresc *</div>

<div id="menu">menu</div>

<div id="stopka">2009 by Vant</div>

    </div>


</body>
</html>

Link to comment
Share on other sites

Guest Beniamins9

Aby dany DIV był wycentrowany należy użyć w CSS polecenia clear: both ale i margin: auto. Poza tym nierozumiem dlaczego wszystkie DIVY są w DIVIE #top ? Po co Ci polecenia overflow ?

Aaa i jeśli w html,body masz ustawione margin i padding to nie wiem czy zadziała clear: both.

Jak chcesz to mogę Ci zrobić przykładowy szablon.

Link to comment
Share on other sites

Jeśli oczywiście możesz, to jak najbardziej - ten kod css jest na pewno dobry, więc możesz zrobić wg. niego.

Jeśli chodzi o powyższy problem, jakoś sobie poradziłem, ale niestety nie mogę ustawić marginesu w menu (chodzi o to, by tekst w menu jak i innych divach miał minimalne marginesy dolne, górne, lewe i prawe.

/edit/ - wiem już, że z tymi marginesami, trzeba zastosować padding, ale zamiast rzeczywiście działać, to po prostu powiększa element div, przez co się rozłazi; czyli niby działa, ale nie tak jak chciałem...

Co do overflow:

Oblewane bloki kolumn posiadają również własność przepełnienia overflow: hidden. Jest to zabezpieczenie na wypadek, gdyby w ich zawartości znalazły się elementy szersze niż mogą pomieścić.

PS Div TOP jest niezbędny, inaczej wszystko się rozłazi. On, że tak powiem, trzyma całość "w kupie". Przynajmniej tak to rozumuję, pierwszy raz robię w divach (wcześniej non stop w tych przeklętych tabelkach).

TEMAT DO ZAMKNIĘCIA, gdyż założyłem nowy temat z nowym problemem.

Link to comment
Share on other sites



  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...