# Fehler im HTML Code, bitte um Hilfe ;)



## EuropaChat (21. August 2010)

Hallo, habe hier einen HTML Code, dort sind noch paar Fehler enthalten z.B. im FF funktioniert es im IE nicht usw. habe es schon mit einem Validator teils bearbeitet. Könnte mir bitte jemand helfen noch die restlichen Bugs zu entfernen, das es so wird wie auf dem Screen.

http://www.europachat.ibitlive.eu/Bild2.jpg

Hier ist der Code:


```
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<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>
  </html>
<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;Clubnight // 21. August</span> </div>
</div>
</div>
</body>
</html>
```



Danke Gruß Markus K.


----------



## SpiceLab (21. August 2010)

Das nenn ich  mal eine grundsolide mißlungene  bis mangelhafte Fehlerbeschreibung 

Sollen wir jetzt erstmal deinen Code durch alle drei gängigen IE-Versionen (6, 7, 8)  jagen, um dahinterzukommen, von welchen "Bugs" du überhaupt in welcher der drei Versionen sprichst?


```
</style>
  </html> <!-- muß </head> lauten, um den Dokumentkopf zu schliessen, bevor der Dokumentkörper mit <body> beginnt -->
<body>
```

Außerdem solltest du einen anderen Doctype wählen, denn mit dem aktuellen schalten *alle* Browser in den "Quirks Mode", was sich gerade und besonders beim IE negativ auswirkt, wie es dir nicht entgangen ist.


----------



## SpiceLab (21. August 2010)

Nachtrag, deine mehrfach genutzte CSS-Eigenschaft *position:fixed* wird von den IEs erst seit dem IE7 unterstützt. 

Dringende Voraussetzung hierfür ist aber, dass das HTML-Dokument den Browsern nicht im "Quirks Mode", sondern mit dem entsprechenden Dokumenttyp im "Standards Mode" übergeben wird, ansonsten verhalten sich IE7 und IE8 in diesem Darstellungsmodi, wie ihr berühmt-berüchtigter Vorgänger IE6, der diese Art der Positionierung nicht zu interpretieren weiß.


Der »DOCTYPE-Switch« und seine Auswirkungen

Für den ollen IE6 kannst du http://code.google.com/p/ie7-js/ in deiner Seite implementieren, damit es in ihm mit der fixierten Positionierung funktioniert - sofern er bei dir noch eine  Berücksichtigung erfährt.


----------



## EuropaChat (21. August 2010)

Danke  habe jetzt den Code und den Doctyp bisschen bearbeitet.

Hier so sieht es jetzt aus, sind aber immer noch Bugs drin. 


```
<!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>
</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)

Ich kann mit meiner (validen) Fassung keinen einzigen Bug ausfindig machen.


```
<!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=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;Clubnight // 21. August</span>
          </div>
     </div>
</div>
</body>
</html>
```

Aber vielleicht weißt / siehst du ja mehr, wie meinereiner.

Und da du weiterhin nicht gewillt bist, diese "Bugs" beim Namen zu nennen, darfst du dir nun einen anderen Spielkameraden suchen gehen, denn für solche Spielereien ist mir meine Freizeit am Wochenende zu kostbar 

Ciao!


----------



## EuropaChat (21. August 2010)

So so sieht jetzt der Code perfekt aus ohne Bugs  Endlich 

Aber so bräuchte ich es wie auf dem Screen zu sehen ist alle 3 nebeneinander. http://www.europachat.ibitlive.eu/Bild2.jpg

Wie kann ich das am besten machen, das in jedem Browser der gleiche Abstand bleibt. 

Hier ist der aktuelle Code:


```
<!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)

Wie kommst du zu der Aussage, dass sich da diskrepante Abstände ergeben? 

Ich kann sie bei mir nicht erkennen / messen.


```
<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 -->
```

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.


----------



## EuropaChat (21. August 2010)

Cooooooooooool, aber wie mache ich das, das es nebeneinander ist, weil so wie ich es im moment sehe ich es untereinander.  


Danke


----------



## SpiceLab (21. August 2010)

Du mußt  dein CSS auch meinem erläuterten Arbeitsschritt im  HTML-Code anpassen, und die ID-Bezeichner in Klassenbezeichner umwandeln. Aus #ID-Name wird .Klassenname.


----------



## EuropaChat (21. August 2010)

Jetzt sitz ich komplett auf dem Schlauch  Was möchtest du dafür, wenn du es mir anpassen könntest?


Hier das ist die main.css:


```
#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)

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:


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

Nachher Klassenbezeichner, zu erkennen an dem Punkt:


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

War das jetzt wirklich so schwer zu verstehen?


----------



## EuropaChat (21. August 2010)

Jetzt verstehe ich das 

Aber dieser Code:


```
<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:


```
<!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.


```
<!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?


```
.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?
> 
> ...


 
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


```
<!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


```
.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:


```
<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


----------



## EuropaChat (22. August 2010)

Könntest mir bitte helfen?


----------



## Scherzkeksrolle (22. August 2010)

Mit nem Taschenrechner?


----------



## EuropaChat (22. August 2010)

Ja  das einzutragen und die Navigation darunter zu Programmieren  bitte


----------



## Scherzkeksrolle (22. August 2010)

Rechnung zur Ermittung der Bild-Abstände:


```
990 - 3 * 250 = 240

240 / 2 = 120
```

Ergibt 120px Abstand zwischen den Bildern.

Und nun gib du mal Gas, ich bin dann am Baggersee


----------



## EuropaChat (22. August 2010)

Was ich gerade nicht ganz verstehe, wo muss ich das ändern? Ich check seit gestern gar nichts mehr ;(


----------



## EuropaChat (28. August 2010)

Hallo,

Habe hier jetzt mal den Quelltext, mir fehlt nur noch der CSS Code, es sollte so integriert werden http://roenix.onpw.de/Bild33.jpg:

HTML:


```
<div class="Wakestars" >
			<a href="http://wakeboarder.lima-city.de.de/" class="sub markt">Marktplatz</a>
			<a href="http://wakeboarder.lima-city.de.de/" class="sub down">Downloads</a>
			<a href="http://wakeboarder.lima-city.de.de/" class="sub tut">Tutorials</a>
			<a href="http://wakeboarder.lima-city.de.de/" class="sub forums">Forum</a>
			<p class="first"><i><strong>Wake</strong>Stars</i> bietet auch:</p>
		</div>	
</div><br style="clear:both"/>
```


CSS Code:


```
.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: 120px;}
.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 }
body { width:1146px; margin: 0;}
```


HTML CODE der 3 Bildern:


```
<!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://wakeboarder.lima-city.de/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.wakeboarder.lima-city.de/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.wakeboarder.lima-city.de/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.wakeboarder.lima-city.de/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>
```


----------



## SpiceLab (28. August 2010)

Wer  in regelmäßigen Abständen alle paar Tage hier aufschlägt, um lediglich seine Frage zum wiederholten Male in dem Thema zu verewigen, damit es in der Themenübersicht des Unterforums wieder an erste Stelle befördert wird, und nach einer kompletten verstrichenen (Arbeits-)Woche noch nicht mal mit dem Ansatz eines Versuches vorspricht, sondern weiterhin beide Hände  kräftig aufhält, um den gebrauchsfertigen Quellcode in Empfang zu nehmen, dem ist der wahre Sinn dieses Forums nicht bis zu seinem Bewußtsein vorgedrungen, und erhält definitiv von mir keine weiteren Hilfestellungen.

Zukünftig wende dich bitte mit deinen Kleinaufträgen direkt ans hiesige Jobforum (http://www.tutorials.de/jobboerse-jobs-tutorials-de/).

Außerhalb von dort bieten die User im Forum den Usern Hillfestellung bei der Selbsthilfe, um das vorgestellte Problem eigenhändig aus der Welt zu schaffen,  und verkörpern nicht den Dummen, der deine Arbeit erledigt, für die du wohlmöglich von dritter Seite vergütet wirst :suspekt:

Asta la vista, Amigo Faulpelz


----------



## EuropaChat (28. August 2010)

Sorry. Hatte rumprobiert und habe mal den Quelltext erstellt. Siehe oben, aber ich komme nicht ganz mit der CSS Datei klar. ;(


----------



## SpiceLab (28. August 2010)

Dann wird's für dich aber ernsthaft Zeit und höchste Eisenbahn, dass du dir Klarheit verschaffst.



Stylesheets (CSS)

Ansonsten wird das dieses Jahr nichts mehr


----------



## EuropaChat (28. August 2010)

Hilf mir bitte bitte bitte das letzte mal noch. 

Ich weiß nicht wie ich das darunter bekomme bzw. wenn ich es versuche dann haut es mir alles durcheinander.

Und warum ich nur am Wochenende meistens Online bin, liegt daran das ich noch in die Arbeit muss


----------



## SpiceLab (28. August 2010)

EuropaChat hat gesagt.:


> Hilf mir bitte bitte bitte das letzte mal noch.


Das kannst du ganz geschmeidig knicken, und dir von der Backe kratzen.

Morgen, spätestens übermorgen, allerspätestens am kommenden Wochenende kehrst du wieder mit einer Bilddatei zurück, die die nächste Aufgabenstellung illustriert, die wieder deinen Gehirnmuskel überansprucht, weil du dir noch immer nicht die Mühe gibst, dich in die Materie einzulesen, und an der Problemlösung selbst zu versuchen.

User, die ihre Codefetzen ins Forum tragen, um sie von Dritten überarbeiten zu lassen, anstatt sich selbst damit zu beschäftigen, und auf diesem Wege ganz nebenbei was dazuzulernen, haben bei mir keinen Stich.

Und wer dann zwischendurch hier nur vorbeischaut, um sein Thema wieder zu puschen, und gar ein zweites Thema eröffnet, dessen Kern dieselbe Frage ist, ist auf meiner persönlichen Sympathieleiter ganz nach unten durchgereicht worden, wo's jämmerlich dunkel und kalt ist.


----------



## EuropaChat (28. August 2010)

Nein, ich komme dann nicht mehr zurück.


----------

