Ich wollt mal fragen ob meine CSS code richtig ist??

Also ich hab ne frage..mein css code stimmt zwar bei mir schon
aber wenn ich mit andere browser gucke
dann sieht meine navi irgendwie schief oder so
hab code von nem freund
aber viele sagen das mein homepage voll schief aussieht
deswegen frage für profis
könnt ihr mir mit code helfen??

HIER IST CODE


/* Diese Klassen werden nicht angezeigt */
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
div.header{display: none;}
h1#title{display: none;}

/* Gestalten der Links */
a:link {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:visited {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:hover {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

body {
background-image: url(http://i29.tinypic.com/avfmus.jpg);}

*{ padding: 0; margin: 0; }

http://i29.tinypic.com/2vazg38.png{
margin: 0 auto;
width: 1285px;
height: 780px;
background-image:url(http://i29.tinypic.com/2vazg38.png);}

#header_container {
position: absolute;
left: 36%;
top: 80px;
margin-left:-490px;
width: 1024px;
height:768px;
background-color:#transperent;
background-image:url(http://i29.tinypic.com/2iw9cmc.jpg);
color:#7400c7;
font-size:10px;
border: 1px solid #transperent;;}


#content {
position: absolute;
left: 53%;
top: 320px;
margin-left:-250px;
width: 500px;
height: 510px;
padding:0px;
color: #7400c7;
font-size:8px;
font-family:verdana;
background-color:transperent;
background-image:url();
border: 1px solid transperent;
overflow:auto;}

#nav_container{
position: absolute;
left: 59%;
top: 430px;
margin-left: -545px;
width: 50px;
border: 0px solid #FFFFF0;}

ul#nav{
width: 50px;
padding: 0px;
margin: 0px;}

li.nav_element{
list-style-type: none;
position: relative;
padding:3px;
width: 80px;}

li.nav_element a{
display: block;
width: 86px;
padding:2px;
font-size:9px;
font-family:verdana;
font-weight: bold;
text-decoration: none;
text-align: left;
color:transparent;
background-color:transparent;
background-image:url(HIER BUTTON-ULR_1);
border: 2px solid transparent;}

li.nav_element a:hover{
color: transparent;
background-color:transparent;
background-image:url(HIER BUTTON-URL_2);}

#counter {
position: absolute;
left: 24%;
top:805px;
margin-left: -320px;
width: 150px;
height:20px;
color:#7400c7;
font-size:13px;
border: 1px solid transparent;}

Schief ist es nicht direkt, bei mir wird es jedenfalls richtig angezeigt.

Jedoch verwendest du ein Background-Design mit festen Werten. Die Navigation, Content, Sidebar, usw. sind fest positioniert und bleiben dort, auch wenn man eine größere Auflösung verwendet.

Sobald jemand eine kleine Auflösung verwendet wird das Bild nur teilweise dargestellt, bzw. vergrößtert. Dadurch stimmen die absoluten Positionen nicht mehr, weil das Bild anders dargestellt wird.

Versuch es mal mal ( Strg und +), dadurch wird die Auflösung größer.
Schreibe einfach, dass man die Auflösung XX * XX verwenden sollte, damit das Design optimal dargestellt wird.
______________
Spendet jetzt für den User -Name entfernt - , damit er sich ein Duden kaufen kann, da seine Schreibkünste die einens 11-jährigen sehr stark ähneln.

und jetzt nochmal auf deutsch hehe.. gib mir einen beispiel
den mit css coden bin ich net so gut