poprawność kodu strony html/css

Wszystko o HTML, XHTML, XML, CSS.
astharoth
Posty: 1
Rejestracja: 03 paź 2012, 16:32:20
Płeć: Niewybrana
User Agent: Opera Windows

poprawność kodu strony html/css

Post autor: astharoth »

Witam forumowiczów :) z góry dziękuję za jakąkolwiek pomoc. Z góry uprzedzam, że nie jestem alfą i omegą jeśli chodzi o tworzenie kodów itp. Skończyłam dawno temu kurs html/css i teraz po dłuższej przerwie postanowiłam odświeżyć pamięć. Bardziej lubię tworzyć grafikę, niż dalszą przeróbkę :) ale do rzeczy, tworzę stronę o sobie, będą tam zawarte moje prace i w efekcie wstępnym strona wygląda tak:

http://olllcia89.phpnet.us/strona2.html

tak wygląda Html:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="strona2.css" />

<title> moja stronka </title>

</head>

<body>


<div id="page">
<div id="head"> <img src="fota_01.jpg" height="125px" width="1024px" alt="piece1" /> </div>
<div id="lewy"> <img src="fota_02.jpg" height="542px" width="118px" alt="piece2" /> </div>

<div id="head2">
<img src="fota_03.jpg" height="543px" width="788px" alt="piece3" />
</div>



<ul id="menu">

<li><a href="#">Link1</a></li>
<li><a href="#">Link2 </a>
<ul>
<li><a href="#"> submenu1 </a></li>
<li><a href="#"> submenu2 </a></li>



</ul>
</li>

<li><a href="#">link3</a></li>
</ul>

</div>


<div id="text">
<p>Hello World</p>
<p>Test polskich znaków: ą ... ż ... ź ... ś ... ę ... ć ... ó ... ł ...
<br>Działa.</p>
<p> naaa naaa </p>
<p> uuuuuu </p>
</div>

<div id="foot"> <img src="fota_04.jpg" height="542px" width="120px" alt="piece5" /> </div>

<div id="foot2"> <img src="fota_06.jpg" height="183px" width="1024px" alt="piece6" /> </div>


</div>
</body>

</html>


Oraz CSS:



body {
background-color: #4b4d4a;



}


#page {

width: 1024px;
float:left;
margin-left: 266px;

}

#head {
width: 1024px;
height: 125px;
margin-top: 0px;
float: left;





}

#head2 {
width: 788px;
height:543px;
float: left;


}

*{
padding:0;
margin:0;
}

body{
text-align:center;
}

div{
display:inline-block;
}

a{
display:block;
color:#fff;
text-decoration:none;
font-weight:bold;
height:20px;
padding:4px 0;
}

ul#menu{
list-style: none;
padding: 0;
margin-top: -542px;
float:left;
margin-left: 305px;
}

ul#menu li{
float: left;
position: relative;
width: 150px;
background-color:#000;
}

ul#menu li ul li{
position: relative;
}

ul#menu li ul{
list-style: none;
visibility:hidden;
position: absolute;
width:150px;
top: 28px;
left: 0;
}

ul#menu li ul li ul{
list-style: none;
visibility:hidden;
position: absolute;
width:150px;
top: 0;
left: 150px;
}

ul#menu li:hover{
background-color:#999;
}

ul#menu li:hover > ul{
visibility:visible !important;
}





#lewy {
height:542px;
width: 118px;
margin-left: 0px;
margin-top: 0px;
float:left;
}

#text {
float: left;
margin-top: 298px;
margin-left: -593px;

}

#foot {
float: left;
margin-top: 125px;
margin-left: -120px;

}

#foot2 {
float:left;
margin-top: -1px;
margin-left: 266px;
}




I teraz moje zapytanie, czy ktoś mógłby rzucić na to okiem? podpowiedzieć co poprawić?

1. Zaobserwowałam, że kiedy powiększam/pomniejszam stronę, czasami dolny element sie rozjeżdża.. nie wiem w czym tak na prawde jest przyczyna..
2. kolejna sprawa, czy wartości ujemne jak np. margin-top: -543px; powodują błędy?
3. Kiedy otwieram stronę, jest ona dziwnie przesunięta. Dopiero przy pomniejszeniu wracam do normalnego wyglądu.


Jeszcze raz dziękuję za poświęcony czas i jakąkolwiek pomoc.

Pozdrawiam,
Ola.
Awatar użytkownika
DeaDriam
Posty: 4023
Rejestracja: 04 lip 2011, 14:00:40
Lokalizacja: Möglingen
Płeć: Mężczyzna
User Agent: Firefox Windows 1024x600
Kontakt:

Re: poprawność kodu strony html/css

Post autor: DeaDriam »

astharoth pisze: Z góry uprzedzam, że nie jestem alfą i omegą jeśli chodzi o tworzenie kodów itp. Skończyłam dawno temu kurs html/css i teraz po dłuższej przerwie postanowiłam odświeżyć pamięć



Sprawdzanie poprawności kodu HTML: http://validator.w3.org/

Sprawdzanie poprawności kodu CSS: http://jigsaw.w3.org/css-validator/
_____________________________________________________
Nie badz pijawka-znalazles rozwiazanie problemu..podziel sie na forum!
----------------------------------------------------------------------------
SmacznY WordpresS>> http://www.przepisyzgarnka.pl <<
ODPOWIEDZ