Vorlage wird nicht richtig angezeigt

Razielim · 06.06.2010

Hallo, hoffentlich kann mir jemand helfen.
Ich habe eine Vorlage erstellt und einen div-container davon als bearbeitbaren bereich ausgewählt, und wenn ich diesden dann bearbeiten will in einer neuen datei, dann wird die Vorlage nicht richtig angezeigt im browser, also die bilder fehlen. Zudem kann ich jetzt wo ich dem bearbeitbaren bereich einen hintergrund zugewiesen habe nicht darauf text eingeben, der erscheint dann immer darunter.

AlexanderBo · 06.06.2010

AW: Vorlage wird nicht richtig angezeigt

erster gedanke gehen richtung pfadangaben.
aonsonsten solltest du html und css posten - m8 das raten 1facher ;-)

Razielim · 06.06.2010

AW: Vorlage wird nicht richtig angezeigt

Das mit dem Text unter dem container hab ich jetzt richtig gestellt, hatte nur einen kleinen Fehler gemacht. Aber die Bilder werden immer noch nicht angezeigt.

ok, hier mal der Code:

HTML:

<style type="text/css"> 
    <!-- 
    body  {
    margin: 0; 
    padding: 0;
    text-align: center; 
    color: #00CC00;
    background-color: #000000;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 100%;
    }
    .twoColHybLtHdr #container {
    width: 80%;
    margin: 0 auto; 
    border: 1px solid #000000;
    text-align: left; 
    background-color: #000000;
    } 
    .twoColHybLtHdr #header {
    background-color: #00CC00;
    background-image: url(../GameNewsbanner%20Kopie.jpg);
    background-position: left top;
    height: 200px;
    width: 1000px;
    padding-top: 0;
    padding-right: 0px;
    padding-bottom: 0;
    padding-left: 0px;
    } 
    .twoColHybLtHdr #header h1 {
    margin: 0; 
    padding: 10px 0; 
    font-family: Arial, Helvetica, sans-serif;
    font-variant: small-caps;
    }
    
    .twoColHybLtHdr #sidebar1 {
    float: left;
    width: 12em; 
    background-color: #F0F0F0;
    background-image: url(../GameNewsbannerside.jpg);
    height: 50em;
    padding-top: 15px;
    padding-right: 0;
    padding-bottom: 15px;
    padding-left: 0;
    }
    .twoColHybLtHdr #sidebar1 h3, .twoColHybLtHdr #sidebar1 p {
    margin-left: 10px; 
    margin-right: 10px;
    }
    
    
    .twoColHybLtHdr #mainContent {
    background-image: url(../mainback.jpg);
    margin-top: 0;
    margin-right: 0px;
    margin-bottom: 0;
    margin-left: 0em;
    background-position: right top;
    padding-left: 200px;
    height: 1000px;
    width: 800px;
    background-repeat: no-repeat;
    background-color: #FFFFFF;
    } 
    .twoColHybLtHdr #footer {
    padding: 0 10px;
    background-color: #00CC33;
    } 
    .twoColHybLtHdr #footer p {
        margin: 0; 
        padding: 10px 0; 
    }
    

    .fltrt { 
        float: right;
        margin-left: 8px;
    }
    .fltlft {
        float: left;
        margin-right: 8px;
    }
    .clearfloat { 
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    }


.strife {
    width:190px;
    height:30px;
    margin-top:1.5em;
    background-color: #99FF99;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 14px;
        }
    --> 
    </style>
<!--[if IE]>
    <style type="text/css"> 
    /* Fügen Sie CSS-Korrekturen für alle IE-Versionen in diesen bedingten Kommentar ein. */
    .twoColHybLtHdr #sidebar1 { padding-top: 30px; }
    .twoColHybLtHdr #mainContent { zoom: 1; padding-top: 15px; }
    /* Mit der obigen proprietären Zoom-Eigenschaft wird IE die Eigenschaft hasLayout zugewiesen, die gegebenenfalls zur Verhinderung verschiedener Fehler erforderlich ist. */
    </style>
    <![endif]-->
</head>

<body class="twoColHybLtHdr">

    <div id="container">
      <div id="header">
      <!-- end #header --></div>
     
      <div id="sidebar1">
        <div class="strife">HOME</div>
        <div class="strife">NEWS</div>
        <div class="strife">REVIEWS</div>
        <div class="strife">SCREENSHOTS</div>
        <div class="strife"></div>
        
      <!-- end #sidebar1 --></div>
     <div class="twoColHybLtHdr" id="mainContent" align="right">
<!-- TemplateBeginEditable name="text" -->text<!-- TemplateEndEditable --></div>
       
   
         <div id="footer">
        <p>Fußzeile</p>
      <!-- end #footer --></div>
    <!-- end #container --></div>
</body>
</html>

cebito · 06.06.2010

AW: Vorlage wird nicht richtig angezeigt

Laut deinen css-Pfaden müssten die Bilder über dem Ordner liegen in dem deine Seite ist, für mich sehr unwahrscheinlich...

Razielim · 06.06.2010

AW: Vorlage wird nicht richtig angezeigt

was für ein Ordner?

cebito · 06.06.2010

AW: Vorlage wird nicht richtig angezeigt

Razielim schrieb:
was für ein Ordner?

Sollte die Frage sich selbst beantworten? Wenn deine HTML-Datei in keinem Ordner liegt, die Pfade zu den Bildern aber mit "../ " beginnen :rolleyes:

Wie sieht denn deine Struktur aus? Wo liegen die Bilder, wo die HTML-Datei? Wo die css (falls ausgelagert). Entschuldige bitte, das ich nicht auf deinen Rechner schauen kann :uhm:

Razielim · 06.06.2010

AW: Vorlage wird nicht richtig angezeigt

also die CSS ist nicht ausgelagert, die befindet sich in der Vorlage mit drinn und die ist im template-ordner. Der Template-ordner befindet sich wiederum im Ordner html und in diesem befinden sich die Bilder sowie die einzelne html-Datei.

cebito · 06.06.2010

AW: Vorlage wird nicht richtig angezeigt

Wenn alles in einem Ordner liegt, sollte ein Bilderpfad statt so

Code:

[I][COLOR=#000080]background-image: url(../GameNewsbannerside.jpg);
[/COLOR][/I]

so aussehen

Code:

[I][COLOR=#000080]background-image: url(GameNewsbannerside.jpg);
[/COLOR][/I]

mit "../" wechselst du nämlich in das übergeordnete Verzeichnis, aber deine Bilder liegen ja im selben wie die html-Datei.

Razielim · 07.06.2010

AW: Vorlage wird nicht richtig angezeigt

Ja, aber die Vorlage befindet sich ja in einem Unterordner und die Bilder sind ja in der Vorlage verlinkt, befinden sich aber nicht im selben Ordner wie die Vorlage.

Budo_ID · 07.06.2010

AW: Vorlage wird nicht richtig angezeigt

Also bei mir funktioniert die anzeige von BIldern bei Deinem Template.
Hast Du schon die korrekte schreibweise der verlinkten Grafiken geprüft?

Im Allgemeinen ist es besser die stylesheets in eine Datei auszulagern und nicht mit in die html - datei hinzuzufügen. Speziell wenn man relative Pfadangaben in der CSS hat.
Die Verlinkung der Bilder richtet sich nämlich nicht nach dem physichen Pfad ( Ordnerstruktur ) sondern nach dem Webseitenaufruf.

Razielim · 15.06.2010

AW: Vorlage wird nicht richtig angezeigt

Ich hatte kürzlich meine Webdesign-lehrerin gefragt deswegen. Und nach mehreren Versuchen, ging das dann auch bei ihr. Da wollt eich as gestern noch mal probieren. Hab alles von Anfang an noch mal neu gemacht und hab schon wieder das selbe Problem.
Kann das tatsächlich einfach nur daran liegen dass ich die css-Datei im template mit drinn habe?

EDIT: lag tatsächlich daran, dass die CSS nicht ausgelagert war, aber das kann doch nicht sein, eigentlich müsst ees doch auch gehen mit einer internen CSS.