Ich hab mich heute durch das Forum gewühlt aber keine passende Antwort gefunden. Ich möchte meine Homepage auch so einrichten, dass sie bei allen Bildschirmauflösungen zu 100% angezeigt wird. Da viele Besucher meiner HP noch 800x600 verwenden und ich das Design vorher in einer viel größeren Version hatte sahen viele nur meinen halben header und weder navigationsleiste noch sonst irgendwas, so musste ich sie kleiner machen. Nun sieht die Seite natürlich auf meinem Bildschirm 1280x800 mickrig aus. Ich habe hier schon vieles dazu gelesen, aber vieles hat mich eben auch verwirrt. Ich benutze das CSS-Design und weder IceBlue noch sonstiges. Im moment sieht mein script so aus:
#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;}
#nav_heading{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
body {
background-color:#696969;}
*{ padding: 0; margin: 0; }
#Mein_Bild {
margin: auto;
width: 800px;
height:980px;
background-image:url();}
#header_container {
position: absolute;
left: 50%;
margin-left:-400px;
width: 797px;
height: 112px;
background-color:#696969;
background-image:url(http://www.bilder-hochladen.net/files/99lh-l.jpg);
color:#FFFFFF;
font-size:13px;
border: 0px solid #FFFFFF;}
#nav_container{
position: absolute;
left: 50%;
top: 200px;
margin-left: -400px;
width: 220px;
border:0px solid #FFFFFF;}
li.nav_element a{
display: block;
width: 220px;
padding:10px;
font-weight: 20;
font-family: 'Lucida Calligraphy';
font-size: 20px;
text-decoration: none;
text-align: left;
color:#FFFF78;
background-color:#696969;
background-image:url();
border: 0px solid #4D2B10;}
li.nav_element a:hover{
color: #FFE53B;
background-color:#696969;
background-image:url(http://www.bilder-hochladen.net/files/99lh-m.jpg);}
#content {
position: absolute;
left: 50%;
top: 200px;
margin-left: -200px;
width: 500px;
height: 8000px;
padding:10px;
color: #000000;
font-size:13px;
background-color: transparent;
background-image:url();
border: 0px solid #FFFFFF;
overflow:auto;}
#counter {
position: absolute;
left: 50%;
top:900px;
margin-left: -400px;
width: 150px;
height:20px;
color:#FFFF78;
font-size:18px;
border: 0px solid #FFFFFF;}
Ich habe schon versucht mit Prozenten zu arbeiten aber das hat auch nicht funktioniert. Oder hab ich was übersehen und muss nicht nur die Prozente sondern auch was anderes ändern? Geht die Anpassung an die Bildschirmgröße überhaupt beim CSS oder nur bei den IceBlue und sonstigen Vorlagen?
Hier die Site:
www.bkh-vom-wartburgblick.de.tl