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

Frame Problem

Coolzero

Mitglied
Hallo, ich habe auf meiner Homepage
Code:
http://www.pamstock08.de/fussball/frame.html
ein frameset verbaut, nur habe ich das Problem das das zwar in Opera 10 absolut korrekt dargestellt wird, nur leider in allen anderen Browsern nicht!
Wieso nicht??

Ich weiss das frames heute nicht mehr so gerne gesehen werden, aber ich hab auch leider keine ahnung wie ich das layout ohne frames so hinbekomme, hab bei css leider nichts passende gefunden!

Wäre super wenn mir einer helfen könnte

Danke
 
Werbung:
eehhhmmmmm....

Ich weiss das frames heute nicht mehr so gerne gesehen werden, aber ich hab auch leider keine ahnung wie ich das layout ohne frames so hinbekomme, hab bei css leider nichts passende gefunden!

Willst du m ich verarschen?
Das sind 3 Divs! Das is die Standard-Seite schlecht hin. Das is ein CSS von 4 Zeilen...

entweder suchst du falsch oder aber auf einerm chinesischen server wo alle ergebnisse gesperrt sind.

Man man man. Frames sind out :D
 
Werbung:
Hallo.

Bei CSS4YOU findest du eine genaue Anleitung wie du dein Design in CSS umsetzten kannst.

Gruss
Elroy

Danke für den Tip, das hat mich schonmal ein ganzes Stück weitergebracht, aber jetzt hänge ich grad an einem neuen Problem,ich hatte immer 3 Framesetz, eins was immer den gleichen inhalt hatte und oben war, dann links ein NAvigations Frame mit Links und dann noch ein Hauptframe wo alle angeklickten Links drin geöffnet wurden, nur wie bekomme ich das jetzt hin???


Bis jetzt sieht der Code so aus:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<meta name="description" content="Sportfreunde Schönstein" />

<style type="text/css"><!--
body 
{
 font-family:Verdana;
 font-size:12px;
 background-color:black;
}
h1 {font-size:35px;color:yellow;margin-bottom:0px;}
h2 {font-size:20px;color:yellow;}
h3 {font-size:14px;color:yellow;}
p {margin-top:0px;}

code {font-size:14px;color:yellow;}
pre
{
 font-size:14px;
 color:yellow;
 padding:5px;
}
a:link, a:visited, a:active, a:hover
{ 
  text-decoration:none;
  font-weight:bold;
  color:#634142;
  font-size:12px;
}
a:active, a:hover
{ 
 text-decoration:underline;
}

#title {
height:150px;
padding:5px;
border-bottom:1px solid yellow;
margin-bottom:5px;
}
#left{
width:14%;
line-height:18px;
}
#left {
float:left;
}

.menutitle
{
font-weight:bold;
border-top:1px dashed yellow;
margin-top:10px;
}

#content {
float:left;
width:80%;
margin-left:10%;
background-color:yellow;
}
//--></style>
<title>Sportfreunde Schönstein</title>
</head>
<body>
<div id="title">
<img src="logo.jpg" style="float:right;width:156px; height:150px;margin-left:3px;" alt="Logo" />
<img src="logo.jpg" style="float:left;width:156px; height:150px;margin-left:3px;" alt="Logo" />
<h1 align="center">Sportfreunde Schönstein</h1>
<h2 align="center"> Willkommen auf der neuen Internet Präsents der Sportfreunde Schönstein!</h2>
<h3 align="center">Hier finden Sie alles Wissenswerte über die Sportfreunde und ihre aktivitäten!</h3></div>




 <div id="left" style="clear:right;">
<p class="menutitle">MENU 1</p>
<a href="startseite.html" div id="content" target="Daten"><b>Startseite</b></a><br>
&raquo; <a class="menu" <a href="startseite.html" target="Daten"><b>Startseite</b></a><br>
&raquo; <a class="menu" href="startseite.html">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br />

<p class="menutitle">MENU 2</p>
&raquo; <a class="menu" href="#">HYPERLINK 1</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br />

<p class="menutitle">MENU 3</p>

&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br /><br />

 
 </div>
 
Hallo.

Du machst für jeden Link eine neue Seite.
Titel und Navigation bleiben ja immer gleich. Nur der Content auf jeder Seite ändert sich. Dann verlinkst du in der Navigation zu den einzelnen Seiten.

Gruss
Elroy
 
Werbung:
re

Habs jetzt mal so gemacht,
Code:
 <div id="left" style="clear:right;">
<p class="menutitle">Erste Mannschaft</p>
<a  href="ausfluege.html">Ausflüge</a><br>
<a  href="DasSpieljahr1.html">Das Spieljahr</a><br>
<a  href="Der Verein.html">DerVerein</a><br>
<a  href="DieMannschaft.html">Die Mannschaft</a><br>

<p class="menutitle">Jugend</p>
Aber dann wir die komplette seite angezeigt und nicht nur das content, was mach ich noch falsch?
 
re

Habs jetzt mal so gemacht,
Code:
 <div id="left" style="clear:right;">
<p class="menutitle">Erste Mannschaft</p>
<a  href="ausfluege.html">Ausflüge</a><br>
<a  href="DasSpieljahr1.html">Das Spieljahr</a><br>
<a  href="Der Verein.html">DerVerein</a><br>
<a  href="DieMannschaft.html">Die Mannschaft</a><br>

<p class="menutitle">Jugend</p>
Aber dann wir die komplette seite angezeigt und nicht nur das content, was mach ich noch falsch?
Wie bekomme ich es hin das es wie hier(mit frames gemacht) angezeigt wird?

Wie bekomme ich es hin das es´wie hier
Code:
http://www.pamstock08.de/fussball/frame.html
(mit frames gemacht) angezeigt wird??
Danke
 
Mal abgesehen davon, dass die Semantik Deines Codes noch nicht stimmt, ist die Antwort auf Deine Frage: Gar nicht.

Für jede Seite eine eigene Datei. Es wird immer eine vollständige Seite geladen. Es werden nie einzelne Bereiche ausgetauscht, das ist ja eines der vielen Probleme, die Frames haben, weil dann die URL nicht mehr stimmt.
 
Werbung:
re

Wie man ja unschwer merkt bin ich ziemlicher neuling,
wenn ich dich jetzt richtig verstehe, muss ich also alle seiten mir dem gleichen layout erstellen und dann wird immer die komplette seite ausgetauscht??!!

dann würde ich die css Datei ja besser auslagern? Und was muss ich dann alles auslagern und was darf bleiben?
Was meinst du mit meine Semantik stimmt nicht??
 
Ganz genau. Jede Seite bekommt eine komplett eigene Datei und wird komplett neu geladen.

CSS lagert man immer am besten in externen Stylesheets aus und bindet die auf jeder Seite erneut ein. So hast Du alle notwendigen Daten zum Layout und Design zentral an einer Stelle - nämlich in Deinem externen Stylesheet. Auf Inline-Styles verzichtet man völlig.

Man trennt strikt HTML von CSS, also Inhalt von Layout. Soviel zu Deiner Frage nach dem Auslagern.

Was die Semantik angeht, meine ich Deinen Beispielcode. Da stimmt die Semantik, also die logische Bedeutung nicht. Denn das ist es ja, worum es bei HTML geht, um die Vergabe einer sinnvollen Semantik. HTML hat ja nichts mit dem Aussehen zu tun.

Du hast in Deinem Beispielcode ein Menü. Ein Menü ist eine Liste von Links und wird daher auch als Liste (z.B. <ul>) ausgezeichnet. In Deinem Beispiel fehlt die Auszeichnung der Links als zusammengehörig und als Liste völlig. Da das <br> am Ende der Zeile hier nur Layoutzwecken dient, muss es völlig entfallen. Denn Layout macht man nur mit CSS, nie mit HTML.

Dann hast p.menutitle. Die sind bei Dir als Textabsätze ausgezeichnet. Aber das sind ja offensichtlich keine Textabsätze, sondern Überschriften. Überschriften haben aber ihre eigenen Tags (von <h1> bis <h6> je nach Ordnung).

Das meine ich damit, dass Deine Semantik falsch ist. Du hast Deinen Inhalt falsch beschrieben. Du hast HTML falsch angewendet. HTML ist nicht nur Syntax und Validität, HTML ist vor allem anderen Semantik.

Liebe Grüße,
-Efchen
 
re

Sorry,aber anscheind bin ich zu blöd dafür, hab jetzt mal folgendes versucht,
ich hab eine layout.css und eine startseite.html erstellt,
die startseite sieht so aus:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Sportfreunde Schönstein</title>
<link rel="stylesheet" type="text/css" href="layout.css">
<style type="text/css">
/* ... hier sind dateispezifische Formate erlaubt ... */
</style>


    	<meta name="Sportfreunde Schönstein">
	 <meta name="keywords" content="Schönstein, Kreisklasse, Westerwald">

</head>

<div align="center"><img src="logo.jpg" width="140" height="130"/></div>
<body bgcolor="yellow" text="black" link="#FF9966" vlink="#FF9900" alink="#FFFFFF">

<h1 align="center"> Aktuelles </h1>

<h2 align="center"> Die neue Saison hat begonnen und bis jetzt siehts in allen Wetbewerben nicht so schlecht aus!</h2>


      
<br />
    
<div align="center"><img src="P1000119.JPG" width="200" height="150" alt="WaldoPam" /> 
<img src="P1000086.JPG" width="200" height="150" alt="WaldoPam" />
<img src="P1000072.JPG" width="200" height="150" alt="WaldoPam" /></div>
<p>
<div align="center"><img src="P1000072.JPG" width="200" height="150" alt="WaldoPam" />
<img src="P1000080.JPG" width="200" height="150" alt="WaldoPam" />
<img src="P1000109.JPG" width="200" height="150" alt="WaldoPam" /></div>

</body>
</html>

die layout.css so:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css"><!--
body 
{
 font-family:Verdana;
 font-size:12px;
 background-color:#ffefde;
}
h1 {font-size:18px;color:#000000;margin-bottom:0px;}
h2 {font-size:16px;color:#000000;}
h3 {font-size:14px;color:#000000;}
p {margin-top:0px;}

code {font-size:14px;color:#0000ff;}
pre
{
 font-size:14px;
 color:#0000ff;
 padding:5px;
}
a:link, a:visited, a:active, a:hover
{ 
  text-decoration:none;
  font-weight:bold;
  color:#634142;
  font-size:12px;
}
a:active, a:hover
{ 
 text-decoration:underline;
}

#title {
height:34px;
padding:5px;
border-bottom:1px solid #000000;
margin-bottom:20px;
}
#left, #right {
width:14%;
line-height:18px;
}
#left {
float:left;
}
#right {
float:right;
}
.menutitle
{
font-weight:bold;
border-top:1px dashed #000000;
margin-top:15px;
}

#content {
float:left;
width:66%;
margin-left:3%;
}
//--></style>
<title>CSS 4 You - The Finest in Stylesheets: Workshop Layouten ohne Tabellen</title>
</head>
<body>
<div id="title">
<img src="logo6.gif" style="float:right;width:156px; height:39px;margin-left:3px;" alt="Logo" />
<h1>10. Dreispaltiges Layout, 100% breit</h1></div>

 <div id="left" style="clear:right;">
<p class="menutitle">MENU 1</p>
&raquo; <a class="menu" href="#">HYPERLINK 1</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br />

<p class="menutitle">MENU 2</p>
&raquo; <a class="menu" href="#">HYPERLINK 1</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br />

<p class="menutitle">MENU 3</p>
&raquo; <a class="menu" href="#">HYPERLINK 1</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br /><br />

 </div> 
 
 <div id="right">
<p class="menutitle">MENU 4</p>
&raquo; <a class="menu" href="#">HYPERLINK 1</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br />

<p class="menutitle">MENU 5</p>
&raquo; <a class="menu" href="#">HYPERLINK 1</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br />

<p class="menutitle">MENU 6</p>
&raquo; <a class="menu" href="#">HYPERLINK 1</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 2</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 3</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 4</a><br />
&raquo; <a class="menu" href="#">HYPERLINK 5</a><br />
 </div>

 
 <div id="content">
 <h2>Drei Bereiche</h2>
 Wenn du dir die anderen Beispiele angesehen hast, dann dürfte mehrspaltiges Layout 
 kein Problem mehr für dich sein. Dieses Beispiel teilt sich in vier Bereiche auf: 
 Die Titelleiste, die Menüs und der Inhalt
 <h2>Die Titelleiste</h2>
Für die Titelleiste habe ich einen <em>&lt;div&gt;</em>-Container verwendet,
da der gesamte Bereich mit einem <a href="../border-bottom.html">unteren Rahmen</a>
versehen werden soll und es mit zwei nebeneinander floatenden Elementen nicht immer möglich ist
einen lückenlosen Rahmen zu erzeugen.<br />
Das Logo und das <em>&lt;h1&gt;</em>-Tag floaten nebeneinander, 
wie in <a href="ex0004.html">Beispiel 4</a> bereits erklärt.
<h2>Die Menüs</h2>
Die Menüs sind ebenfalls in <em>&lt;div&gt;</em>-Container eingefügt,
die mit den folgenden Stylesheets formatiert sind:
<pre>
#left, #right {
width:14%;
line-height:18px;
}
#left {
float:left;
}
#right {
float:right;
}
</pre>
Für die <em>&lt;div&gt;</em>-Container ist jeweils das <em>ID</em>-Attribut angegeben:
<pre>
&lt;div id=&quot;left&quot;&gt;
Linkes Menü
&lt;/div&gt;

...

&lt;div id=&quot;right&quot;&gt;
Rechtes Menü
&lt;/div&gt;
</pre>
Die <a href="../width.html">Breite</a> ist auf 14% festgelegt und die
<a href="../line-height.html">Zeilenhöhe</a> sorgt für etwas Abstand unter den
Hyperlinks im Menü.<br />
Die Eigenschaft <a href="../float.html">float</a> plaziert Elemente 
auf der Seite und lässt andere vorbeifließen. In diesem Fall wird dem 
<em>&lt;div&gt;</em>-Container für das linke Menü <code>float:left</code> 
und dem Rechten <code>float:right</code> zugewiesen, um sie links- und rechtsbündig
auf der Seite zu plazieren.
<h2>Inhalt</h2>
Ähnlich wie in <a href="ex0007.html">Beispiel 7</a> soll der Inhalt in der Mitte stehen.
Nur dass in diesem Fall ein <em>&lt;div&gt;</em>-Container mit den folgenden Stylesheets
verwendet wird, damit der Spalteneffekt entsteht:
<pre>
float:left;
width:66%;
margin-left:3%;
</pre>
Deshalb ist für den Inhalt, genauer gesagt für den <em>&lt;div&gt;</em>-Container des Inhalts,
<code>float:left</code> angegeben, um ihn rechtsbündig neben dem Menü auszurichten. 
Weiterhin ist die Breite auf 82% festgelegt. Rechnet man die 12% vom Menü dazu, bleiben
6% als horizontaler Abstand zwischen beiden Bereichen übrig. Das ist alles.<br />
Hier ist noch eine auf die <em>&lt;div&gt;</em>-Container reduzierte
<a href="ed0010.html">vereinfachte Darstellung</a>
 </div>
<p style="text-align:left;clear:both;margin-top:20px;"><a class="prev" href="index.html#example">Zurück</a></p>
</body>
</html>


Aber die seite wir absolut nicht angezeigt wie ich es nerwartet hab!
 
Werbung:
Bevor Du Dich an das Aussehen machst, muss ja auch die Basis aus validem und semantisch sinnvollem HTML stehen, das tut sie noch nicht.

Valide ist es nicht, weil kein Inhalt vor dem <body> stehen darf.

Du solltest Dir außerdem angewöhnen, Inhalt und Layout strikt voneinander zu trennen, d.h. keine Inline-Styles, keine veralteten HTML-Attribute, die für die physische Auszeichnung sind (wie z.B. "align") und auch keinen style-Bereich im Header; alles, was mit dem Aussehen zu tun hat, verschwindet im HTML-Code und wandert in ein externes Stylesheet.

Dann Semantik...jedes Tag hat eine Bedeutung, mit der Du sagst, was Dein Inhalt bedeutet. Du hast da z.B. ein heimatloses "<p>". Das steht eigentlich für Textabsatz. Ich sehe aber keinen Textabsatz. Also hat das Tag an der Stelle keine Existenzberechtigung.
Dann <div>. Damit gruppiert man mehrere Elemente. Aber ohne ihnen damit eine Bedeutung zu geben. Du hast zahlreiche Bilder. Was sollen die bedeuten? Gib ihnen eine Existenzberechtigung. Ist das eine Liste? Zeichne sie als Liste aus. Dann brauchst Du womöglich auch das <div> nicht mehr, weil <ul> auch ein Block-Element ist und sich genauso verhält, wie <div>.
Dein h2 empfinde ich irgendwie nicht als Überschrift, bist Du bei der Auszeichnung sicher?
Dein Logo missfällt mir noch in dem <div>. Aber um das wirklich beurteilen zu können, müsste ich wissen, wie es gemeint ist. Wenn ich das Logo sehen würde, und wüsste, wo Du es später hinhaben willst, wäre das besser.

Kurzum: Nett zu hören, dass es nicht so angezeigt wird, wie Du es erwarteet hast, aber ohne es zu sehen und ohne zu wissen, was Du erwartet hast, kann ich dazu nichts sagen. Bei Anfängern ist es darüberhinaus meist sogar so, dass sie etwas erwarten, was so nicht funktioniert. Sie haben oft z.B. eine falsche Vorstellung vom Box Modell.

Also stell die Seite, nachdem Du die notwendigen Änderungen gemacht hast, mal online, dann schau ich wieder drauf. Und dann beschreibst Du dazu noch, was Du so nicht erwartet hast, das kann ich nämlich nicht erraten :-)
 
<hr /> definiert IMHO einen logischen Bruch. Theoretisch kann man das auch erreichen, indem man die Elemente vorher und nachher zu einer logischen Gruppe zusammenfasst.

Es kommt ja immer darauf an, was man erreichen will. Wll ich nur irgendwelche bedeutungslosen Striche, dann ist es sicherlich CSS.

Aber wenn ich die Definition beim W3C lese, dann sollte man wohl eher dazu tendieren, es nicht zu verwenden:
The HR element causes a horizontal rule to be rendered by visual user agents.
 
Werbung:
so hab jetzt nochmal en bischen rum probiert, die erste html datei, heißt startseiteneu.html und sieht so aus:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="de">

<head>
<title>Sportfreunde Schönstein</title>
<link rel="stylesheet" type="text/css" href="layout.css" />
</head>

<body>
<h1> Willkommen auf der Internetseite der Sportfreunde Schönstein!</h1>
<p>Herzlich Willkommen auf der neuen Internetseite der Sportfreunde Schönstein</p>

<div id="link">
<ul>
<li><a href="">Startseite</a><br></li>
<li><a href="derverein.html">Der Verein</a></li>
<li><a href="">Gästebuch</a><br></li>
<li><a href="">Forum</a><br></li>
<li><a href="">Kontakt</a></li>
<li><h2>ERSTE MANNSCHAFT</h2></li>
<li><a href="">Die aktuelle Saison</a><br></li>
<li><a href="">Veranstqaltungen</a><br></li>
<li><a href="">Ausflüge</a></li>
<li><h2>Alte Herren</h2></li>
<li><a href="">Die aktuelle Saison</a><br></li>
<li><a href="">Veranstqaltungen</a><br></li>
<li><a href="">Ausflüge</a></li>
<li><h2>Die Jugend</h2></li>
<li><a href="">Die aktuelle Saison</a><br></li>
<li><a href="">Veranstqaltungen</a><br></li>
<li><a href="">Ausflüge</a><br></li>
<br>
<br>
<br>

</ul>
</div>

<div id="zaehler">
<ul>
<li> Bisherige Besucher</li>
</ul>
</div>

<script language="JavaScript" type="text/javascript" src="http://www.onlex.de/_counter.php4?username=Coolzero"></script>

<h2>V 0.1</h2>

<div id="picture">
<img src="P1000072.jpg" width="300" height=300" alt="Feier1">
<img src="P1000080.jpg" width="300" height=300" alt="Feier2">
<img src="P1000086.jpg" width="300" height=300" alt="Feier3">
<br>
<img src="P1000109.jpg" width="300" height=300" alt="Feier4">
<img src="P1000110.jpg" width="300" height=300" alt="Feier5">
<img src="P1000119.jpg" width="300" height=300" alt="Feier6">
</div>
</body>

</html>
und die css datei namens layout.css, so:
body {
background-color: black;
background-image: url("logo.jpg");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 50% 20%;
}

h1 {
color :yellow;
font-family: arial, verdana, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: 300%;
text-decoration: underline;
text-align: center;
font-weight: bold;
}
h2 {
color :yellow;
font-family: arial, verdana, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: 100%;
text-decoration: underline;
text-align: left;
font-weight: bold;
}
p {
color : yellow;
font-family: arial, verdana, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: 100%;
text-align: center;
}

#link {
color:blue;
}
a:link {
color: blue;
text-align: left;
font-size: 100%;

}

a:visited {
color: red;
font-size: 100%;

}
a:active {
color: yellow;
font-size: 100%;
}
a:hover {
color: black;
font-style: italic;
text-transform: uppercase;
font-weight:bold;
background-color:yellow;
font-size: 100%;
}
#zaehler {
color:yellow;
}

#picture {
position:relative;
left: 200px;
bottom: 300px;

}
Und wie sieht es bis jetzt aus?
Hab jetzt das erste Problem, die zweite Seite namens derverein.html sieht bis jetzt so aus:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="de">

<head>
<title>Sportfreunde Schönstein</title>
<link rel="stylesheet" type="text/css" href="layout.css" />
</head>

<body>

<h1>Die Geschichte</h1>

<p>Herzlich Willkommen auf der neuen Internetseite der Sportfreunde Schönstein</p>

<div id="link">
<ul>
<li><a href="startseiteNeu.html">Startseite</a><br></li>
<li><a href="derverein.html">Der Verein</a></li>
<li><a href="">Gästebuch</a><br></li>
<li><a href="">Forum</a><br></li>
<li><a href="">Kontakt</a></li>
<li><h2>ERSTE MANNSCHAFT</h2></li>
<li><a href="">Die aktuelle Saison</a><br></li>
<li><a href="">Veranstqaltungen</a><br></li>
<li><a href="">Ausflüge</a></li>
<li><h2>Alte Herren</h2></li>
<li><a href="">Die aktuelle Saison</a><br></li>
<li><a href="">Veranstqaltungen</a><br></li>
<li><a href="">Ausflüge</a></li>
<li><h2>Die Jugend</h2></li>
<li><a href="">Die aktuelle Saison</a><br></li>
<li><a href="">Veranstqaltungen</a><br></li>
<li><a href="">Ausflüge</a><br></li>
<br>
<br>
<br>

</ul>
</div>

<div id="zaehler">
<ul>
<li> Bisherige Besucher</li>
</ul>
</div>

<script language="JavaScript" type="text/javascript" src="http://www.onlex.de/_counter.php4?username=Coolzero"></script>

<h2>V 0.1</h2>
</body>

</html>
Jetzt überschneidet sich der <p> Bereich schon mit dem logo, wie kann ich das für die Seite in der einen Layout Datei anpassen?
Danke
 
Die <br />'s haben in dem Menü nichts zu suchen.

Das <h2> am Ende ist unnötig.

Welches Logo meinst Du?
 
Werbung:
Da Du es als Hintergrund definierst kann es logischerweise von dem Inhalt der Seite überlagert werden. Entweder Du definierst es als <img>-Tag oder schiebst den Inhalt oder das Hintergrundbild so zurecht, dass es nicht mehr überlagert wird.
 
So habs jetzt als img in die Einzelnen Daeien geschrieben!
Hab jetzt noch das Problem, das die links die links auf der Seite stehen erst ca. auf der hälfte der Seite beginnen, sie sollen aber direkt oben stehen!
Wie bekomme ich das noch hin
?
 
Zurück
Oben