Skocz do zawartości

Zarchiwizowany

Ten temat jest archiwizowany i nie można dodawać nowych odpowiedzi.

Gość

XHTML + CSS - jak zrobić prosty szablon?

Polecane posty

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 do komentarza
Udostępnij na innych stronach

Gość 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 do komentarza
Udostępnij na innych stronach

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 do komentarza
Udostępnij na innych stronach



  • Kto przegląda   0 użytkowników

    • Brak zalogowanych użytkowników przeglądających tę stronę.
×
×
  • Utwórz nowe...