Fehler im HTML Code, bitte um Hilfe ;)

SpiceLab · 21. August 2010

Lesen dürftest du soweit selbst können - fett markiert hatte ich sie dir ja in meinem vorletzten Post zudem

spicelab hat gesagt.:
Die mehrfach gleichnamigen ID-Bezeichner #teaser_content und #teaser_content_image hab ich hier entsprechend in Klassenbezeichner umgewandelt, da nur diese im Dokumentkörper mehrfach vergeben werden dürden. IDs hingegen müsssen eindeutig sein, dürfen also nur einmal im Dokumentbaum genannt werden.

http://de.selfhtml.org/css/formate/zentrale.htm#klassen zum Studium.

EuropaChat · 21. August 2010

Ich schwitz schon

Ja das hab ich schon gelesen, aber was muss ich im CSS Code ändern, das verstehe ich nicht ganz?

SpiceLab · 21. August 2010

Dann geh halt zur Erfrischung kalt duschen.

Vorher ID-Bezeichner, zu erkennen an dem #-Zeichen:

CSS:

#teaser_content {...}
#teaser_content_image {...}

Nachher Klassenbezeichner, zu erkennen an dem Punkt:

CSS:

.teaser_content {...}
.teaser_content_image {...}

War das jetzt wirklich so schwer zu verstehen?

EuropaChat · 21. August 2010

Jetzt verstehe ich das

Aber dieser Code:

PHP:

<div id="teaser_holder">
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild1.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild1.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild1.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
</div><!-- ENDE #teaser_holder -->

Muss ja irgendwie hier integriert werden:

PHP:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta http-equiv="Content-Type"
 content="text/html; charset=utf-8">
  <link type="text/css" rel="stylesheet"
 href="http://europachat.ibitlive.eu/css/main.css">
  <style type="text/css">
#teaser_content_navigation ul { list-style-type: none; padding-left: 10px; margin: 0px; }
#teaser_content_navigation li { display: block; line-height: 15px; font-style: bold; color:#CCC }
  </style>
  <!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script>
<![endif]-->
</head>
<body>
<div id="teaser_holder">
<div id="teaser_content">
<div id="teaser_content_image"> <img
 style="border: 0px solid ; width: 250px; height: 145px;" alt=""
 src="http://www.europachat.ibitlive.eu/images/www/Bild1.jpg"><br
 style="color: rgb(255, 0, 0);">
<span style="color: rgb(255, 0, 0);">
&gt;&nbsp;Follow us on Facebook</span> </div>
</div>
</div>
</body>
</html>

SpiceLab · 21. August 2010

Tja, da kommst du wohl in kürzester Zeit ein weiteres Mal zum Schwitzen, wo der Code jetzt wohl hingehört.

Dass es sich hierbei um deinen eigenen handelt, den ich für die drei gewünschten
Boxen aufgestockt habe, ist bei dir wohl nicht angekommen. :suspekt:

Mein Code in Post #7 bezieht sich in dieser Fassung selbstverständlich auf den Dokumentkörper deiner Seite, der mit <body></body> ausgezeichnet ist.

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>...</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<link type="text/css" rel="stylesheet" href="http://europachat.ibitlive.eu/css/main.css">
<style type="text/css">
#teaser_content_navigation ul { list-style-type: none; padding-left: 10px; margin: 0px; }
#teaser_content_navigation li { display: block; line-height: 15px; font-style: bold; color:#CCC }
</style>
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script>
<![endif]-->
</head>
<body>
<div id="teaser_holder">
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild1.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild1.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild1.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
</div><!-- ENDE #teaser_holder -->
</body>
</html>

EuropaChat · 21. August 2010

Ahh Stimmt Danke

So und hier in der main.css Datei folgendes oder aber in der index.html Datei ist ja oben auch noch ein kleiner CSS Abschnitt, was ist mit dem?

PHP:

.teaser_holder { position: fixed; bottom: 10px; width: 1000px; height: 330px; margin-left: -500px; left: 50%;}
.teaser_background { position: fixed; bottom: 10px; width: 1000px; height: 125px; margin-left: -500px; left: 50%; background-color: #333; z-index:110; }
.teaser_content {position: relative; top: 45px; width: 262px; z-index:120; float:left; text-transform: uppercase; font-size: 9px; margin-left: 53px;}
.teaser_content_image {position: relative; padding:6px 6px 14px 6px; background-color: #000; font-size:  11px; }
.teaser_content img { margin-bottom: 4px;   }
.teaser_content_navigation { margin: 6px 2px 0px 6px; font-size: 11px; }
.teaser_content_navigation ul { list-style-type: none; padding-left: 10px; margin: 0px; }
.teaser_content_navigation li { display: block; line-height: 15px; font-style: bold; color:#CCC }

SpiceLab · 21. August 2010

EuropaChat hat gesagt.:

Ahh Stimmt Danke

So und hier in der main.css Datei folgendes oder aber in der index.html Datei ist ja oben auch noch ein kleiner CSS Abschnitt, was ist mit dem?

PHP:

.teaser_holder { position: fixed; bottom: 10px; width: 1000px; height: 330px; margin-left: -500px; left: 50%;}
.teaser_background { position: fixed; bottom: 10px; width: 1000px; height: 125px; margin-left: -500px; left: 50%; background-color: #333; z-index:110; }
.teaser_content {position: relative; top: 45px; width: 262px; z-index:120; float:left; text-transform: uppercase; font-size: 9px; margin-left: 53px;}
.teaser_content_image {position: relative; padding:6px 6px 14px 6px; background-color: #000; font-size:  11px; }
.teaser_content img { margin-bottom: 4px;   }
.teaser_content_navigation { margin: 6px 2px 0px 6px; font-size: 11px; }
.teaser_content_navigation ul { list-style-type: none; padding-left: 10px; margin: 0px; }
.teaser_content_navigation li { display: block; line-height: 15px; font-style: bold; color:#CCC }

Was soll mit dem sein?

Ich hab vor viereinhalb Stunden in deinem präsentierten HTML-Code lediglich in den beiden benannten <div>'s teaser_content und teaser_content_image das id-Attribut gegen class getauscht.

EuropaChat · 21. August 2010

Jetzt funktioniert es. GEIL! Danke, so habe ich mir das vorgestellt

Top! http://www.europachat.ibitlive.eu/

EuropaChat · 22. August 2010

So, jetzt habe ich die Index.html Datei, die ich mir vorstelle als Bild erstellt, die so aussieht:

http://europachat.ibitlive.eu/Bild33.jpg Ich weiß, auf dem Screen schlecht zu sehen.

Sowas bräuchte ich unter diese Bilder, der Quellcode ist das, die drei Bilder müssten angepasst werden:

index.html

PHP:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<link type="text/css" rel="stylesheet" href="http://europachat.ibitlive.eu/css/main.css">
<style type="text/css">
.teaser_content_navigation ul { list-style-type: none; padding-left: 10px; margin: 0px; }
.teaser_content_navigation li { display: block; line-height: 15px; font-style: bold; color:#CCC }
</style>
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script>
<![endif]-->

</head>
<body>
<div id="teaser_holder">
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild3.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild3.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
     <div class="teaser_content">
          <div class="teaser_content_image">
               <img style="border: 0px solid ; width: 250px; height: 145px;" alt="" src="http://www.europachat.ibitlive.eu/images/www/Bild3.jpg">
               <br style="color: rgb(255, 0, 0);">
               <span style="color: rgb(255, 0, 0);">&gt;&nbsp;Clubnight // 21. August</span>
          </div>
     </div>
</div>

</body>
</html>

main.css zur Index.html

PHP:

.teaser_holder { position: fixed; bottom: 10px; width: 1000px; height: 330px; margin-left: -500px; left: 50%;}
.teaser_background { position: fixed; bottom: 10px; width: 1000px; height: 125px; margin-left: -500px; left: 50%; background-color: #333; z-index:110; }
.teaser_content {position: relative; top: 45px; width: 262px; z-index:120; float:left; text-transform: uppercase; font-size: 9px; margin-left: 53px;}
.teaser_content_image {position: relative; padding:6px 6px 14px 6px; background-color: #000; font-size:  11px; }
.teaser_content img { margin-bottom: 4px;   }
.teaser_content_navigation { margin: 6px 2px 0px 6px; font-size: 11px; }
.teaser_content_navigation ul { list-style-type: none; padding-left: 10px; margin: 0px; }
.teaser_content_navigation li { display: block; line-height: 15px; font-style: bold; color:#CCC }

Es sollte die Breite vom Footer haben, der Footer HTML Code ist dieser:

PHP:

<style>
#footer {
clear :both;
background-color:#252525;
color:#FAFAFA;
font-size:10px;
height:17px;
margin:15% auto 5px;
padding:3px 0;
text-align:center;
width:990px;
-moz-border-radius:7px 7px 7px 7px;
}
#footer a {
color:#FAFAFA;
font-family:arial,sans-serif;
line-height:17px;
}
    </style>
<div id="footer" >	
    <a href="http://www.roenix.onpw.de/Support.html" style="text-decoration: none">Support</a> |
    <a href="http://www.roenix.onpw.de/Hilfe.html" style="text-decoration: none">Hilfe</a> |
    <a class="secFarbe" href="http://www.roenix.onpw.de/Impressum.html" rel="nofollow" style="text-decoration: none">
    Impressum</a>

Aber wie kann ich das am besten machen?

Ich komm schon wieder ins schwitzen

Fehlt noch irgendwas? Glaube aber nicht

EDIT: Farbe der Navigation #EEEEEE

Scherzkeksrolle · 22. August 2010

EuropaChat hat gesagt.:
Sowas bräuchte ich unter diese Bilder, der Quellcode ist das, die drei Bilder müssten angepasst werden:

Aber wie kann ich das am besten machen?

Rechnen kannst du offensichtlich auch nicht, um die drei Bilder auf die Strecke des Footers zu verteilen.

Na denn... Nachhilfe in Mathe erwünscht

Fehler im HTML Code, bitte um Hilfe ;)

SpiceLab

ZENmechanic

EuropaChat

Erfahrenes Mitglied

SpiceLab

ZENmechanic

EuropaChat

Erfahrenes Mitglied

SpiceLab

ZENmechanic

EuropaChat

Erfahrenes Mitglied

SpiceLab

ZENmechanic

EuropaChat

Erfahrenes Mitglied

EuropaChat

Erfahrenes Mitglied

Scherzkeksrolle

Neue Beiträge