• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Brauche hilfe mit div Containern

ste3et_C0st

Neues Mitglied
Hallo ich hätte eine frage und zwar wie schaff ich es das div container samt ihnhalt sich dem Browser fenster anpasst ich hab mal ne kleine homepage geschrieben mit lauter div container alles in % angaben nur ich komm nichmer weiter das verschiebt sich immer alles


Das ist der html Code

Code:
<html style="height:100%;" style="width100%">    <head>


        <script type="text/javascript" src="dropdown.js"></script>
    <script type="text/javascript" src="scripts/jquery-1.6.4.min.js"></script>
    <script type="text/javascript" src="jquery.nivo.slider.pack.js"></script>
    <script type="text/javascript">
    $(window).load(function() {
        $('#slider').nivoSlider();
    });
    </script>
        <link rel="stylesheet" type="text/css" href="main.css">
        <style type="text/css">main.css</style>
        <title>Dicecraft</title>
    <link rel="stylesheet" href="themes/default/default.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="themes/pascal/pascal.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="themes/orman/orman.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
    </head>
        <body>
            <center>
                <div id ="side">
                    <div id ="titelanzeige">
                        <div id ="header">
<div id="strichweis"></div>
<!--Slider-->
<div id="wrapper">
        <a href="http://dev7studios.com" id="dev7link" title="Dicecraft">dev7studios</a>


        <div class="slider-wrapper theme-default">
            <div class="ribbon"></div>
            <div id="slider" class="nivoSlider">
                <a href="#"><img src="http://www.html.de/images/toystory.jpg" alt=""/></a>
                <a href="#"><img src="http://www.html.de/images/up.jpg" alt="" title="Mitspieler der Woche" /></a>
                <img src="http://www.html.de/images/walle.jpg" alt="" data-transition="slideInLeft" />
                <img src="http://www.html.de/images/nemo.jpg" alt="" title="#htmlcaption" />
            </div>
            <div id="htmlcaption" class="nivo-html-caption">
                <a>Haus Der Woche</a>
            </div>
        </div>
        </div>
            </center>
                <div id="left">
            </div>
                <div id="reight">    
            </div>
<!--Das hier ist der Navigations bereich-->
                <div id ="navbg">
                    <div id ="navigationsnamen" style="top:20%;">    
                        <a onmouseover="aufklappen()" onmouseout="zuklappen()" class="selected" href="#">Home</a>
                        <a onmouseover="aufklappen2()" onmouseout="zuklappen2()" class="href2" href="#" style="color:fff;">Live Map</a>
                        <a class="href2" href="#" style="color:fff;">Forum</a>
                        <a onmouseover="aufklappen3()" onmouseout="zuklappen3()" class="href2" href="#" style="color:fff;">Suport</a>
                        <a onmouseover="aufklappen4()" onmouseout="zuklappen4()" class="href2" href="#" style="color:fff;">Web Auction</a>
            </div>
<!--Das hier ist das erste Dropdown Menü-->
            <div id="ddmenue" onmouseover="aufklappen()" onmouseout="zuklappen()">
                <div id="ddtext" class="dd1_1_1">
                <p><a href="#" class="dd1_1_1">&Uuml;ber den Server </a></p>
                <p><a href="#" class="dd1_1_1">Preisliste </a></p>
                <p><a href="#" class="dd1_1_1">Event </a></p>
                <p><a href="#" class="dd1_1_1">Tutorials </a></p>
                <p><a href="#" class="dd1_1_1">Downloads</a></p>
            </div>
            </div>
<!--2ter-->
            <div id="ddmenue2" onmouseover="aufklappen2()" onmouseout="zuklappen2()">
                <div id="ddtext2">
            <p><a  href="#" class="dd1_1_1">Dynmap</a></p>
            <p><a  href="#" class="dd1_1_1">Nitrado Map</a></p>
            </div>
            </div>
<!--3ter-->
            <div id="ddmenue3" onmouseover="aufklappen3()" onmouseout="zuklappen3()">
                <div id="ddtext3">
                <p><a href="#" class="dd1_1_1">FAQ</a></p>
                <p><a href="#" class="dd1_1_1">Suport Formular</a></p>
                <p><a href="#" class="dd1_1_1">Suport Team</a></p>
                <p><a href="#" class="dd1_1_1">Verlink Uns</a></p>
            </div>
            </div>
<!--4ter-->
            <div id="ddmenue4" onmouseover="aufklappen4()" onmouseout="zuklappen4()">
                <div id="ddtext4">
            <p><a  href="#" class="dd1_1_1">Dynmap</a></p>
            <p><a  href="#" class="dd1_1_1">Nitrado Map</a></p>
            </div>
            </div>
<!---->
                    </div>
<!---->
            <center>
                <div id = "container1" style="hight:100%" style="width:100%">
                    <h1>Die Bilder sind nur l&uuml;cken f&uuml;ller die echten folgen bald</h1>
            </center>
                <div id = "footer" style="hight:100%" style="width:100%">
            Ste3et_C0st
            </div>
            </div>
            </center>
        </div>
    </body>
</html>

Und das der css

Code:
* {margin:0px;
padding:0px;
margin-top:0px;
}


html{
        background:url('bg2.png') ;
        background-repeat: repeat-x repeat-y;
        background-position: center;
        background-attachment:fixed;
        display: block;
    }
body{
width: 100%;
height:100%;
display: block;
top:0%;
left:0%;
clear:both;
float:left;
min-height:100%;
min-width:100%;
max-height:100%;
max-height:100%;
}
#titelanzeige{
        top: 15%;
        left: 0%;
        width:100%;
        height:100%;
        display: block;
        background-color:none;
        clear:both;
        float:left;


}




#header{
        background-image:url('top-bottom-bg.png');
        background-repeat: repeat-x;
        background-position: 30% 30%;
        position:relative;
        left: 0%;
        width:100%;
        height:100%;
        display: block;
        margin-right: auto;
        margin-left: auto;
        margin-top: auto;
        clear:both;
        float:left;
        display: block;
}




#container1{
        position:absolute;
        margin-bottom:10%;
        top:80%;
        left: 20%;
        max-width:44.11764705882353%;
        max-height: auto;
        display: block;
}


h1{
        font-family: Small Fonts, Helvetica, sans-Serif;
        font-variant: small-caps;
        font-size: 36px;
        color: 808080;
        display: block;
}


#trennstrich{
        top: 60%;
        left: 70%;
        position: relative;
        background:url('bg3.png') ;
        background-repeat: repeat-y;
        height: 40%;
        width: 100%;
        clear:both;
        float:left;
        display: block;
}


#footer{
        background-image: url(footer-picture.png);
        left: 0%;
        top: 100%;
        position: relative;
        position: bottom;
        background-repeat: repeat-y repeat-x;
        height:20%;
        width: 100%;
        clear:both;
        float:left;
        display: block;
}


#side{
        height: 100%;
        width: 100%;
        margin-left: auto; 
        margin-right: auto;
        margin:auto;
        clear:both;
        float:left;
        display: block;
}


#navbg{
        position: absolute;
        background-image:url(navbar.png);
        top:0%;
        left:25%;
        width:50%;
        background-repeat:repeat-x;float:left;"
        clear:both;
        float:left;
        display: block;
}




#left{
        background-image:url(left.png);
        background-repeat: no-repeat;
        top:0%;
        left: 24.3%;
        position: relative;
        display: block;
}


#reight{
        background-image:url(right.png);
        background-repeat: no-repeat;
        top:0%;
        left:74.8%;
        position: absolute;
        display: block;
        
}


#navigationsnamen
{
position: relative;
color:#fff;
left:5%;
font-size:125%;
word-spacing: 1.5em;
letter-spacing: -1;
color:fff;
text-transform: uppercase; 
white-space: nowrap;
}


.href2
{
text-decoration: none;
color:#fff;
font-size:1em;
font-variant: small-caps;


}




#left, #reight , #nav, #navbg
{
height:10.2%;
}


#left, #reight
{
width:1.2%;
}


#navbg


{
width:50%;
}




  
.selected
{ color: FFD700;
  text-decoration: none;
} 




  
#ddmenue
{
Background-image:url(dd1.png);
background-repeat: no-repeat;
position:relative;
top:13%;
height:700%;
display:none;
font-family: Small Fonts, Helvetica, sans-Serif;
}


#ddmenue2
{
Background-image:url(dd2.png);
background-repeat: no-repeat;
position:relative;
top:13%;
height:100%;
left: 16%;
display:none;
font-family: Small Fonts, Helvetica, sans-Serif;
}


#ddmenue3
{
Background-image:url(dd3.png);
background-repeat: no-repeat;
position:relative;
top:13%;
height:170%;
left: 50%;
width:60%;
display:none;
font-family: Small Fonts, Helvetica, sans-Serif;
}


#ddmenue4
{
Background-image:url(dd4.png);
background-repeat: no-repeat;
position:relative;
top:13%;
height:170%;
left: 65%;
width:60%;
display:none;
font-family: Small Fonts, Helvetica, sans-Serif;
}


#ddtext, #ddtext2, #ddtext3, #ddtext4
{
text-decoration: none;
color:#fff;
font-size:100%;
font-variant: small-caps;
position:relative;
left:2%;
top:1%;
}


.dd1_1_1
{
text-decoration: none;
color:#fff;
}


#left, #reight , #nav, #navbg,#ddtext, #ddtext2, #ddtext3, #ddtext4,#ddmenue,#ddmenue2,#ddmenue3,#ddmenue4
{
z-index:900;
}


#strichweis
{
Background-image:url(sw.png);
height:2px;
background-repeat: x-repeat;
position:relative;
top:63%;
}

Bitte ich brauche hilfe. :sad:

Ihr könt die Page auch runterlade der dl link ist hier top-bottom-bg.zip
 
Hallo,

schau dir mal mit dem Validator deinen Code an. Verwende einen Doctype und korrigiere erst die Fehler. Sorge dafür das sämtliche Stilanweisungen in dein CSS wandern. Wenn du das gemacht hast und dein Browserfenster immer noch zickt meldest du dich hier noch mal.

The W3C Markup Validation Service
 
Es gibt ein paar Dinge, die man als Anfänger möglichst vermeiden sollte. Dazu gehören u.a. Prozentangaben und die Verschiebung von Elementen außerhalb des umgebenden Div's mittels position: relative. Warum willst du eigentlich, dass sich der Container unbedingt dem Viewport des Users anpassen soll? Mein Arbeitsrechner besitzt eine Auflösung von 2560x1440 und da wird das Erscheinungsbild immer anders wirken als auf einem 13" Notebook. Wenn dein HTML/CSS nicht das tut, was es soll, dann vereinfache es erst einmal soweit, bis es funktioniert, erweitere den Code anschließend Stück für Stück und validiere nach jedem Zwischenschritt.

- Minimales Grundgerüst mit Größenangaben in Pixeln schreiben.
- Den Nivo-Slider einbinden.
- Zum Schluss gegebenenfalls die Pixelwerte durch Prozente ersetzen.
 
Hallo,

Ich glaube nicht das unter den gegebenen Umständen jemand bereit ist sich durch das Durcheinander zu arbeiten.

Hier mal die gröbsten Schnitzer:
Du hast kein Zeichensatz angegeben. Meta-Tag Charset fehlt.
Dein Code eine einzige Div-Suppe, wo man nicht durchsteigt. Du hast Div-Tags, die du gleich wieder schliesst, das ist unsinnig.
Tronjer hat dir gesagt was du zuerst machen musst. Nämlich ein Grundgerüst erstellen ohne CSS nur in HTML.
Du musst dir im klaren sein, wie dein Layout aussehen soll. Ob es sich flexibel anpassen soll oder feste Grössen haben soll.
Des weiteren musst du dir im klaren sein wie viele Spalten du haben willst.

Du hast in deinem Header sage und schreibe 5 CSS-Dateien angegeben, obwohl man nur 1 braucht.
Klassennamen und ID-Namen sollten keine Leerzeichen enthalten.
Du verwendest veraltete Tags, zum Beispiel Center, zentrieren macht man mit CSS.
Du verwendest Inline-Styles, obwohl du 5 CSS-Dateien hast.
Das Menü kannst du in CSS bauen.

Das Beste ist neu anzufangen und zwar erst mal nur das Layout.
Das Grundgerüst worauf du aufbaust erhältst du jetzt hier:

HTML:
<!DOCTYPE HTML>
<html>         
    <head>                 
        <meta charset="UTF-8">                 
        <link rel="stylesheet" type="text/css" href="main.css">                 
        <title>Dicecraft</title>         
    </head>         
    <body>                 
        <div id="header">
            <p>Kopfbereich, hier kann auch das Menü rein</p>
        </div>
        <div id="content">
            <p>Hauptteil</p>
        </div>
        <div id="footer">
            <p>Hauptteil</p> 
        </div>
    </body>
</html>
 
INDEX.HTML

Code:
<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="UTF-8">  
            <script type="text/javascript" src="js/dropdown.js"></script>
            <script type="text/javascript" src="js/mouse.js"></script>
            <script type="text/javascript" src="scripts/jquery-1.6.4.min.js"></script>
            <script type="text/javascript" src="scripts/jquery.nivo.slider.pack.js"></script>
                <link rel="stylesheet" type="text/css" href="main.css">
                <link rel="stylesheet" href="themes/default/default.css" type="text/css" media="screen" />
                <link rel="stylesheet" href="themes/pascal/pascal.css" type="text/css" media="screen" />
                <link rel="stylesheet" href="themes/orman/orman.css" type="text/css" media="screen" />
                <link rel="stylesheet" href="slidercss/nivo-slider.css" type="text/css" media="screen" />
                <link rel="stylesheet" href="slidercss/style.css" type="text/css" media="screen" />
                <link rel="apple-touch-icon" href="packg.png" />
                    <title>Dicecraft</title>
    </head>
        <body>
        
<!--Hier ist Der DivContainer der die Gantze Seite umschließt-->


            <div id="Seite">
            
<!--Das hier ist Header-->


                <div id ="header">


<!--Das hier ist Das logo (Ausfahrbar auf der linken oberen seite)-->


                    <a onmouseover="home1()" href="http://dev7studios.com" id="home" title="Dicecraft">dev7studios</a>
                    <a onmouseout="home2()" href="http://dev7studios.com" id="home2" title="Dicecraft">dev7studios</a>
                    
<!--Das hier ist der Weiße strich unter dem Header-->


                <div id="strichweis"></div>


<!--Das hier ist der Schatten des Headers-->


                    <div id="schatten"></div>

<!--Slider Bilder Wechsler im Header-->


        <div id="wrapper">
            <div class="slider-wrapper theme-default">
                <div class="ribbon"></div>
                    <div id="slider" class="nivoSlider">
                        <a href="#"><img id="erstesbild" src="http://www.html.de/images/toystory.jpg" alt=""/></a>
                        <a href="#"><img src="http://www.html.de/images/up.jpg" alt="" title="Mitspieler der Woche:   jeje_" /></a>
                            <img src="http://www.html.de/images/walle.jpg" alt="" data-transition="slideInLeft" />
                            <img src="http://www.html.de/images/nemo.jpg" alt="" title="#htmlcaption" />
                        </div>
                    <div id="htmlcaption" class="nivo-html-caption">
                <a>Haus Der Woche</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>


<!--Das ist die Navigations Leiste (Links/Rechst die Kanten)-->


<div id="left">
    </div>
<div id="reight">    
    </div>


<!--Das hier ist der Navigations bereich  (Hauptteil/Hintergrund)-->


                <div id ="navbg">
                
<!--Das hier ist der Navigations bereich  (Hauptteil/Text)-->


                    <div id ="navtext">    
                        <a onmouseover="aufklappen()" onmouseout="zuklappen()" class="selected menu2" href="index.html">Home</a>
                        <a onmouseover="aufklappen2()" onmouseout="zuklappen2()" class="href2 menu" href="#">Live Map</a>
                        <a class="href2 menu" href="#">Forum</a>
                        <a onmouseover="aufklappen3()" onmouseout="zuklappen3()" class="href2 menu" href="#">Suport</a>
                        <a onmouseover="aufklappen4()" onmouseout="zuklappen4()" class="href2 menu" href="#">Web Auction</a>
                    </div>
                    
<!--Das hier ist das erste Dropdown Menü-->


            <div id="ddmenue" onmouseover="aufklappen()" onmouseout="zuklappen()">
                <div id="ddtext" class="dd1_1_1 menu">
                    <p><a href="#" class="dd1_1_1 menu">&Uuml;ber den Server </a></p>
                    <p><a href="#" class="dd1_1_1 menu">Preisliste </a></p>
                    <p><a href="#" class="dd1_1_1 menu">Event </a></p>
                    <p><a href="#" class="dd1_1_1 menu">Tutorials </a></p>
                    <p><a href="#" class="dd1_1_1 menu">Downloads</a></p>
                </div>
            </div>
            
<!--2tes Dropdown Menü-->


            <div id="ddmenue2" onmouseover="aufklappen2()" onmouseout="zuklappen2()">
                <div id="ddtext2">
                    <p><a  href="dynmap.html" class="dd1_1_1 menu">Dynmap</a></p>
                    <p><a  href="#" class="dd1_1_1 menu">Nitrado Map</a></p>
                </div>
            </div>
            
<!--3tes Dropdown Menü-->


            <div id="ddmenue3" onmouseover="aufklappen3()" onmouseout="zuklappen3()">
                <div id="ddtext3">
                    <p><a href="#" class="dd1_1_1 menu">FAQ</a></p>
                    <p><a href="#" class="dd1_1_1 menu">Suport Formular</a></p>
                    <p><a href="#" class="dd1_1_1 menu">Suport Team</a></p>
                    <p><a href="#" class="dd1_1_1 menu">Verlink Uns</a></p>
                </div>
            </div>
            
<!--4tes Dropdown Menü-->


            <div id="ddmenue4" onmouseover="aufklappen4()" onmouseout="zuklappen4()">
                <div id="ddtext4">
                    <p><a  href="#" class="dd1_1_1 menu">Dynmap</a></p>
                    <p><a  href="#" class="dd1_1_1 menu">Nitrado Map</a></p>
                </div>
            </div>
            
<!--Hier wird der div mit der id = navbg geschlossen (Ende der Navigations Leiste) -->


                    </div>
                    
<!--Hier fängt Der hauptteil der Seite an -->


                <div id = "container1">
                    <h1>Die Bilder sind nur l&uuml;cken f&uuml;ler</h1>
                </div>
    
<!--Fußzeile-->


                <div id ="footer">


<!--Minecraft symbol im Fußbereich-->


                    <div id ="buy">
                        <a href="#"></a>
                    </div>
    
<!--Copyright Bereich in Der Fußzeile-->


                        <div id="CopyRight">
                            <p><a>Die &copy; Des Bilder Sliders iegen bei</a></p>
                            <p><a href="http://dev7studios.com/" class="dd1_1_1 menu">dev7studios</a></p>
                            <p><a>Die &copy; Der Homepage bei</a></p>
                            <p><a> Ste3et_C0st</a></p>
                        </div>
                    </div>


<!--Jetzt ist Der Footer bereich wieder zu-->


        </body>
</html>

HOFFE ES IST ÜBERSICHTLICH GENUG

Sry muss die Css datei in einen Weiteren Post schreiben Da es sont zuviele zeichen sind.

DL Link:

http://www.mediafire.com/?16ibfsrmbtvgpwr

VT (Virus Total link valls benötigt)

http://www.virustotal.com/file-scan...b250b893448ac2dc81b21c6c68cbe0ea71-1322504199



http://www.mediafire.com/?16ibfsrmbtvgpwr
 
Zuletzt bearbeitet:
Und was erwartest Du nun? Wustersoss hat dir bereits geschrieben was derzeit alles falsch ist. Allzuviel hast Du da ja bisher nicht verbessert?!
 
MAIN.CSS

Code:
* {    margin:0px;
    padding:0px;
    margin-top:0px;
    padding:0;
}


html
{
    background:url('bilder/bg2.png') ;
    background-repeat: repeat-x repeat-y;
    background-position: center;
    background-attachment:fixed;
    display: block;
    height:100%;
    width:100%;
}


body
{
    width: 100%;
    height:100%;
    display: block;
    top:0%;
    left:0%;
    clear:both;
    float:left;
    min-height:100%;
    min-width:100%;
    max-height:100%;
    max-height:100%;
}


h1
{
    font-family: Small Fonts, Helvetica, sans-Serif;
    font-variant: small-caps;
    font-size: 29px;
    color: #808080;
    display: block;
}


#header
{
    background-image:url('bilder/top-bottom-bg.png');
    background-repeat: repeat-x;
    background-position: 30% 30%;
    position:relative;
    left: 0%;
    width:100%;
    height:100%;
    display: block;
    margin-right: auto;
    margin-left: auto;
    margin-top: auto;
    clear:both;
    float:left;
    display: block;
    z-index:900;
}


#Seite
{
    position:relative;
    top:0%;
    left:0%;
    clear:both;
    float:left;
    display: block;
    width:100%;
    height:70%;
    z-index:900;
}


#container1
{
    top:0%;
    clear:both;
    left:10%;
    width:60%;
    height:auto;
    float:left;
    position:relative;
    z-index:900;
}


#dynmap
{
    top:0%;
    clear:both;
    left:0%;
    width:100%;
    height:auto;
    z-index:900;
}


#footer
{
    height:30%;
    width: 100%;
    top:1%;
    clear:both;
    background:url('bilder/footer-picture.png');
    background-repeat:repeat-x;
    position: relative;
    z-index:900;
}


#navbg{
    background-image:url(bilder/navbar.png);
    top:0%;
    left:25%;
    width:50%;
    background-repeat:repeat-x;float:left;
    clear:both;
    float:left;
    display: block;
    position: absolute;
    z-index:900;
    height:10.2%;
    width:50%;
}




#left{
    background-image:url(bilder/left.png);
    background-repeat: no-repeat;
    top:0%;
    display: block;
    right:74.6%;
    position: absolute;
    z-index:900;
    width:1.2%;
    height:10.2%;
}


#reight
{
    background-image:url(bilder/right.png);
    background-repeat: no-repeat;
    top:0%;
    left:74.8%;
    display: block;
    position: absolute;
    z-index:900;
    width:1.2%;
    height:10.2%;
}


#navtext
{
    left:5%;
    font-size:125%;
    word-spacing: 1.5em;
    letter-spacing: -1;
    color:fff;
    top:20%;
    text-transform: uppercase;
    position: relative;
    color:#fff;
    background-color:transparent;
    text-decoration: none;
    z-index:900;
}
 
#ddmenue
{
    Background-image:url(bilder/dd1.png);
    top:13%;
    height:700%;
    display:none;
    font-family: Small Fonts, Helvetica, sans-Serif;
    position: relative;
    background-repeat: no-repeat;
    z-index:900;
}


#ddmenue2
{
    Background-image:url(bilder/dd2.png);
    top:13%;
    height:100%;
    left: 16%;
    display:none;
    font-family: Small Fonts, Helvetica, sans-Serif;
    position: relative;
    background-repeat: no-repeat;
    z-index:900;
}


#ddmenue3
{
    Background-image:url(bilder/dd3.png);
    top:13%;
    height:170%;
    left: 52%;
    width:60%;
    display:none;
    font-family: Small Fonts, Helvetica, sans-Serif;
    position: relative;
    background-repeat: no-repeat;
    z-index:900;
}


#ddmenue4
{
    Background-image:url(bilder/dd4.png);
    top:13%;
    height:170%;
    left: 68%;
    width:60%;
    display:none;
    font-family: Small Fonts, Helvetica, sans-Serif;
    position: relative;
    background-repeat: no-repeat;
    z-index:900;
}


#ddtext
{
    font-size:100%;
    font-variant: small-caps;
    left:2%;
    top:1%;
    z-index:900;
    position: relative;
    z-index:900;
}


#strichweis
{
    Background-image:url(bilder/sw.png);
    height:0.2604166666666667%;
    background-repeat: x-repeat;
    position: relative;
    top:82%;
    z-index:900;
}


#schatten
{
    Background-image:url(bilder/background.png);
    height:3.125%;
    background-repeat: x-repeat;
    top:82%;
    position: relative;
    z-index:900;
}


#buy
{
    Background-image:url(bilder/minecraft.png);
    background-repeat: no-repeat;
    height:30%;
    top:20%;
    left:2%;
    width:60%;
    position: relative;
    z-index:900;
}


#CopyRight{
    height:30%;
    top:20%;
    left:80%;
    width:20%;
    font-size:100%;
    font-variant: small-caps;
    position: absolute;
    text-decoration: none;
    color:#fff;
    background-color:transparent;
    z-index:900;
}


.href2
{
    font-size:1em;
    font-variant: small-caps;
    text-decoration: none;
    z-index:900;
    color:#fff;
    background-color:transparent;
    text-decoration: none;
}




.selected
{ 
    color: #FFD800;
    text-decoration: none;
    z-index:900;
}


a.menu:link
{
    color:#fff;
    background-color:transparent;
    text-decoration: none;
    color:#FFD800;
    background-color:transparent;
}


a.menu:active
{
    color:#fff;
    background-color:transparent;
    text-decoration: none;
    color:#FFD800;
    background-color:transparent;
}


a.menu:hover
{ 
    color:#000; 
    background-color:transparent; 
}


a.menu2:hover
{ 
    color:#000; 
    background-color:transparent; 
}


a.menu2:visited
{
    color:#FFD800;
    background-color:transparent;
}


a.menu2
{
    color:#fff;
    background-color:transparent;
    text-decoration: none;
    color:#FFD800;
    background-color:transparent;
}


.dd1_1_1
{
    color:#fff;
    background-color:transparent;
    text-decoration: none;
}

Wollte eigentlich Doppelpost vermeiden die anderen css datein sind im link der sich einen Beitrag drüber befindet natürlich könnt ihr euch die homepage anschauen und zwar hier: http://dicecraft.lima-city.de und ich möchte es umgefär so wie hier WonderCraft | die bilder werden geändert ich will nur so ein änliches tamplate (alle bilder werden geändert behalten aber die gröse) ich möchte das sich meine Homepage automatisch der Browser größe anpasst nur ich weis nicht wie die kompltten daten sind in dem Link den ich gepostet habe (Beitrag davor)

Die Html Datei sowie die Css datei wurde von unnötigen Einträgen entfernt und Übersichtlicher gemacht
 
ich möchte es umgefär so wie hier WonderCraft

Ok, dann mach es so wie da.

Designed by Elegant WordPress Themes | Powered by WordPress

Das steht ganz unten auf der Seite von Wondercraft.
Installiere dir Wordpress und installiere anschliessend das Theme dazu.
Das erspart dir viele Probleme und du hast es dann so wie du es haben willst. Als Blog.
 
Zurück
Oben