Design im Eimer durch Funpic

tintwo · 11. April 2009

Problem gelöst

Da jetzt alles klappt könnt ihr ja mal was zum Design sagen
_____________________________________________________________

Hallo ihr da draussen, ich habe ein klitzekleines Problem.

Funpic mag mein Design wohl nicht, könntet ihr mal einen Blick drauf werfen?

Erklärt sich eigendlich von selbst das Problem, die Knuddeluffschaltzentrale
gehört eigendlich unten in den Inhalt rein.

http://tintwo.ti.funpic.de/index.html

Quelltexte:

HTML:

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
    <title>Pok&eacute;mon</title>
	<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta name="description" content="" />
    <meta name="author" content="tintwo" />
    <meta name="keywords" content="" />
    <meta name="generator" content="" />
	<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
   <div id="seite">
        <!-- linker Rand -->
       <div id="seitelinks">
         <img src="pikachu.jpg" width="100" height="96"/>
         <hr> </hr>
         <img src="glumanda.jpg" width="100" height="100"/>
         <hr> </hr>
         <img src="bisasam.jpg" width="100" height="100"/>
       </div>
       <!-- rechter Rand -->
       <div id="seiterechts">
         <img src="pikachu.jpg" width="100" height="96"/>
         <hr> </hr>
         <img src="glumanda.jpg" width="100" height="100"/>
         <hr> </hr>
         <img src="bisasam.jpg" width="100" height="100"/>
       </div>
         <!-- Kopfbereich -->
         <div id="kopfbereich">
            <img src="pokemon_logo.jpg" width="700" height="200"/>
         </div>
         <!-- Steuerung -->
         <div id="steuerung">
           <ul>
             <li><a href="index.html">Startseite</a></li>
             <li><a href="index.html">Was ist Pok&eacute;mon</a></li>
           </ul>
         </div>
         <!-- Inhalt -->
         <div id="inhalt">
           <p><h1>Pok&eacute;mon</h1></p>
           <br />
           <p>Hallo...</p>
           <p>Ich heisse euch herzlich willkommen in der Welt der Pok&eacute;mon. Genau in diese Welt m&ouml;chte ich euch nun entf&uuml;hren,</p>
           <p>ich hoffe nat&uuml;rlich das ich euere Begeisterung f&uuml;r Pok&eacute;mon wecken oder ein wenig auffrischen kann.</p>
           <br />
           <br />
           <hr></hr>
           <br />
           <br />
           <p>
             Vielleicht sollte ich euch noch euren treuen begleiter Knuddeluff vorstellen. Knuddeluff wird dir immer weiter helfen
             wenn du ein Problem hast, sprecht ihn einfach an wenn etwas ist. Ihr erkennt ihn ausserdem daran das er in seiner
             Lieblingsfarbe schreibt,
           </p>
           <p><font color="green">Gr&uuml;n!</font></p>
           <br />
           <p>
             <img src="knuddeluff.jpg" width="180" height="220" alt="Das ist Knuddeluff." style="margin-left: 250px;"/>
           </p>
           <br />
           <p>Doch nun w&uuml;nsche ich euch noch Viel Spass in der Welt der Pok&eacute;mon!</p>
         </div>
      <div id="knuddeluff">
        <div id="knuddeluffpic">
          <img src="knuddeluff1.jpg" width="60" height="80" alt="Das ist Knuddeluff." />
        </div>
        <p>Wie kann ich helfen?</p>
      </div>
   </div>
   <!-- Fussbereich -->
   <div id="footer">
     <p><h6>©Copyright 2009 tintwo</h6></p>
   </div>
</body>
</html>

Alles anzeigen

CSS:

Code

* {
	margin:0;
	padding:0;
}




#seite {
    width: 900px;
    height: 1315px;
	margin: 0 auto;
	margin-top: 60px;
}




#kopfbereich {
    float: none;
    width: 700px;
    height: 200px;
	margin: 0 auto;
    background-color: #CCCCCC;
}




#seitelinks {
    float: left;
    width: 100px;
    height: 1315px;
	margin: 0 auto;
    background-color: #CEB98E;
}




#seiterechts {
    float: right;
    width: 100px;
    height: 1315px;
	margin: 0 auto;
    background-color: #CEB98E;
}




#steuerung {
    float: none;
    width: 700px;
    height: 40px;
	margin: 0 auto;
    background-color: #CEB98E;
}




#steuerung ul {
    list-style: none;
}




#steuerung ul a:link {
    text-decoration: none;
    font-family: fantasy;
    color: #000000;
    float: left;
    padding: 9.8px;
    margin-right: 5px;
    background-color: #CEB98E;
    border-left: 1px solid black;
    border-right: 1px solid black;
}




#steuerung ul a:visited {
    text-decoration: none;
    font-family: fantasy;
    color: #000000;
    float: left;
    padding: 9.8px;
    margin-right: 5px;
    background-color: #CEB98E;
    border-left: 1px solid black;
    border-right: 1px solid black;
}




#steuerung ul a:hover {
    text-decoration: none;
    font-family: fantasy;
    color: #000000;
    float: left;
    padding: 9.8px;
    margin-right: 5px;
    background-color: #CEB674;
    border-left: 1px solid black;
    border-right: 1px solid black;
}




#inhalt {
    font-size: medium;
    font-family: Courier;
    color: #333333;
    letter-spacing: 0.5px;
    padding: 10px;
    width: 700px;
    height: 960px;
    margin-left: 100px;
    background-color: #CCCCCC;
}




#inhalt h1 {
    font-size: x-large;
    font-family: Courier;
    color: #333333;
    text-align: center;
}




#knuddeluff {
    color: green;
    font-size: large;
    width: 700px;
    height: 115px;
    margin-left: 100px;
    background-color: #CCCCCC;
    border-top: 15px solid #CEB98E;
}




#knuddeluffpic {
    float: right;
    width: 60px;
    height: 80px;
    background-color: #CCCCCC;
}




#footer {
    width: 900px;
    height: 50px;
	margin: 0 auto;
    margin-bottom: 150px;
    background-color: #CEB98E;
}




#footer h6 {
    color: #333333;
    text-align: center;
}

Alles anzeigen

lauras · 12. April 2009

sieht cool aus, ist ja aber noch nicht viel drin...
aber die idee find ich gut, und die umsetzung ist auch nicht schlecht..

LG

PS.: du solltest in deinen Hauptordner eine index Datei legen, man sieht den Ordner

tintwo · 12. April 2009

Meinst du das:

http://tintwo.ti.funpic.de/poke/index.html

Wenn du das meinst, ja das stimmt das kann ich mal änder,
ich hatte das nur zur Übersicht in dem Ordner auf meinem PC und hab den dann einfach hochgeladen.

Zum Glück habe ich von Anfang an darauf geachtet den
Quelltext übersichtlich einzurücken, dann habe ich auch noch bestimmte
Zeilen farbiert um schneller etwas zu finden.

Übrigens, da an die Seiten kommen noch mehr Bilder, die muss ich aber
erst fertig machen.

YetiZwerg · 12. April 2009

Zitat von "tintwo"

farbiert

rofl... tu mir einen Gefallen und versuch erst garnicht iwelche Wörter zu verwenden, die du nicht kennst... sonst kommt sowas bei rum..

tintwo · 12. April 2009

Ich weiss schon das das nen blödes Wort ist, ist doch egal,
mir würden sicher noch andere Worte dafür einfallen.

War doch nur als Spass gedacht.

Code

dann habe ich auch noch bestimmte
Zeilen eingefärbt um schneller etwas zu finden. 




dann habe ich auch noch bestimmte
Zeilen farbig ausgefüllt um schneller etwas zu finden. 




dann habe ich auch noch bestimmte
Zeilen mit Farbe gekennzeichnet um schneller etwas zu finden.

Alles anzeigen

lauras · 12. April 2009

also ich mag das Wort

folgendes: du solltest eine index.html hier erstellen:

<a class="postlink" href="http://tintwo.ti.funpic.de/">http://tintwo.ti.funpic.de/</a>index.html

Weil normalerweise sollten die Ordner nicht zu sehen sein. Einfach dadrauf ne Automatische Weiterleitung und fertig

tintwo · 12. April 2009

Habe ich jetzt gemacht, und nochwas,

geh mal auf "Was ist Pokémon" und dann klick unten in der Knuddeluff Zentrale auf "Problem 1"

lauras · 12. April 2009

ja wo liegt das Problem denn?

tintwo · 13. April 2009

Is kein Problem, ich findes nur gut wie ich das gemacht hab oder?

lauras · 13. April 2009

jo, aber es nervt ein bisschen, dass es nicht im gleichen fenster aufgeht... ich versuche dann immer auf zurück u klicken und das geht dann nicht..

tintwo · 13. April 2009

Das ändere ich dann mal eben

tintwo · 14. April 2009

Ich überarbeite jetzt das Design komplett, das erscheint mir ein wenig Trist
oder?

Meinen Inhalt schreibe ich auch noch einmal um

----------------------------------------------------------------------

Yeahhhhhhhh ein Doppelpost, jetzt bin ich offiziell Gangster...

lauras · 14. April 2009

Ein bisschen trist, aber die Idee ist gut!

tintwo · 14. April 2009

Das ist aber generell zu klein finde ich

Dann noch große Schrift, und PAFF alles voll!

lauras · 14. April 2009

gut!

tintwo · 14. April 2009

Ich nutze jetzt den kompletten Platz den ein Browser bietet

Design im Eimer durch Funpic

Jetzt mitmachen!

Teilen