Hi allerseits,
Ich bins mal wieder!
Mir ist aufgefallen, dass trotz der Prozentangaben, bei einer sehhhrr geringen Auflösung alles verschoben ist. Das ist aber ger nich das Problem, da die Aulösung wirklich Minimum war! (ich glaube um die 600x600)
Das Problem ist, dass die zweite Extrabox im IE verschoben wird, obwohl sogar ein IE hack (htm, body{...} ) eingebaut ist!
könnte mir eventuell jemand dmait helfen, alles im IE sowie im FF richtig darzustellen! (lasst euch nicht von den nicht-abgerundeten Ecken ablenken; da arbeite ich schon dran)
Hier der Code:
Text über dem Design:
<div id="Mein_Bild"></div>
Unter dem Design:
<div id="Infos_container"><div id="Infos_heading">Infos:</div>
<!--Infos hier eintragen-->
<div id="Infos_content">
Nun ist es soweit!
Der Umbau ist fast abgeschlossen!
Der neue Titel ist:
" Electro_Freaks.de.tl"!!!
Nun beginnt der Einbau des Inhalts!</div>
<!--hier die Infos eintragen-->
</div>
<div id="sockel">©Copyright 2009 by Electro_Freaks.de.tl | Design & Coding by Nico Büker| Alle Rechte vorbehalten!!</div>
Ohne style tags:
html, body { height: 123%; margin:0; padding:0;
background-color: black;}
#Mein_Bild {
margin: 0;
width: 100%;
height: 150%;
margin: 0;
padding: 0;
background-image:url(http://img.webme.com/pic/n/nico-pb-page/pc11.gif);}
a:link {
color: white;
font-size: 13px;
text-decoration: underline;}
a:visited{
color: white;
font-size: 13px;
text-decoration: underline;}
#header_container {
position: absolute;
margin-left:0px;
top: 40px;
width: 100%;
height:100px;
background-color:#343434;
background-image:url(http://img.webme.com/pic/f/free-picture/gamebanner.jpg);
color:#FFFFFF;
font-size:13px;
border: 1px solid #FFFFFF;}
#header{
position: absolute;
left: 50%;
margin-left: -365px;
top: 20px;
color: white;
font-family: Comic Sans MS;
font-size: 27px;}
#content {
position: absolute;
top: 140px;
margin-left: 15%;
width: 61%;
height: 200%;
padding:10px;
color: #F2F2F2;
font-size:13px;
background-color:#343434;
background-image:url();
border: 1px solid #FFFFFF;
-moz-border-radius-bottomright:100px;
-moz-border-radius-bottomleft:100px;
overflow:auto;}
#nav_container{
position: fixed;
top:140px;
margin-left: 0px;
width: 15%;
border:1px solid #FFFFFF;
-moz-border-radius-topleft: 100px;
-moz-border-radius-bottomleft: 100px;}
ul#nav{
width: 130px;
padding: 15px;
margin: 0px;
padding-bottom: 50px;}
li.nav_element{
list-style-type: none;
position: relative;
padding:5px;
width: 115px;}
li.nav_element a{
display: block;
width: 115px;
padding:4px;
font-weight: bold;
text-decoration: none;
text-align: left;
color:blue;
background-color:#343434;
background-image:url(HIER BUTTON-ULR_1);
border: 2px solid #000000;}
li.nav_element a:hover{
color: #000000;
background-color:#C9C9C9;
background-image:url(HIER BUTTON-URL_2);}
#counter{
position: absolute;
top: 115px;
margin-left:80%;
padding-right:10px
width: 180px;
height: 20px;
color: black;
font-size:13px;
border: 2px solid white;
-moz-border-radius: 75px;}
#sidebar_container{
position: absolute;
top:140px;
margin-left: 77%;
width: 19%;
height: 45%;
background-color:#343434;
background-image:url;
border:1px solid #FFFFFF;
-moz-border-radius-topright: 50px;
-moz-border-radius-bottomright: 50px;
color:#000000;
overflow:auto;}
#sidebar_content{
color: white;
position: absolute;
margin-left: 35px;
top: 95px;}
#sidebar_content a{
color: white;}
#sidebar_content a:visited{
color: white;}
#sidebar_heading{
color: white;}
#Infos_container{
position: absolute;
margin-left: 77%;
margin-top: -82%;
width: 20%;
height: 45%;
background-color: #343434;
border: 1px solid white;
-moz-border-radius-topright: 75px;
-moz-border-radius-bottomright: 75px;
color:#000000;
overflow:auto;
clear: both;}
#Infos_heading{
font-family: Verdana;
font-size: 24px;
color: white;
position: relative;}
#Infos_content{
font-family: Comic Sans MS;
font-size: 19px;
color: white;
position: relative;
width: 99%;
height: 75%;
margin-top: 18%;}
#sockel {
width: 55%;
color: white;
border: 2px dotted white;
-moz-border-radius: 50px;
background-color:#343434;
margin-left: 18%;
margin-top: -20%;
padding-left: 25px;
position: absolute;}
Screenshot FF
Screenshot IE 7 (glaub ich)