Hallo Thea
Hallo,
dank eurer Hilfe http://forum.de.selfhtml.org/archiv/2004/9/88693/ habe ich nun mein ursprüngliches Problem behoben. Dafür habe ich jetzte in anderes Problem *freu* Seht's euch mal an: http://www.8ung.at/thea/startseite.jpg
du bist echt hartnäckig - im postiven Sinne ;-)
Aber beim durchsehen deines Quelltextes - ich hab mir sogar alles runtergeladen - ist mir es doch zuviel geworden, dir gezielt zu helfen. Dass du versuchst mit CSS deine Seiten zu gestalten ist sicher ein guter weg, aber dein Ansatz ist etwas - wie soll ich es sagen? mhhh? - stümperhaft.
Das Problem ist, dass du versucht statt einer Tablle alles mit DIV's zu erreichen, das ist eine sogennante DIV Suppe und deine ist besonders fett. Da sind unzählige leere DIV Elemente auf deiner Seite das ist schonmal schlecht. Auch leere DIV's die dann 'linie' heißen deuten darauf hin, dass du die Möglichkeiten von CSS nicht nutzt.
Wie es besser gehen könnte versuch ich mal exemplarisch an Aktionen leiste zu demonstrieren.
Die Kunst mit CSS zu gestalten ist die, dass du erst eine HTML Seite baust, wo der Inhalt entsprechend seiner Stellung im Text einem HTML Element zugeordnet wird. Wenn du dir diese Leiste anschaust siehst du eine Aufzählung, erst ein Titel, dann ein Text. dies passt optimal zu dem HTML Element Beschreibnungs (s. selfhtml). Ich hab dann noch ein Verbesserungsvorschlag bezüglich der Zugänglichkeit eingebaut und die 'pt' angaben für die Schriftgröße in % umgewandelt (pt ist keine geeignete Größe für die Darstellung am Monitor) und der HTML Code sieht, dann so aus:
<body>
<div id="linkeseite">
<dl>
<dt>
<a href="http://www.wollingster-see.de/news/show_news.php?subaction=showfull&id=1093491225&archive=&template=wosee"
onclick="window.open(this.href, '_News', 'HEIGHT=500,WIDTH=545,resizable=yes,scrollbars=yes');return false;"
>26.08.2004</a>
</dt>
<dd>
Heute Bericht in der Nordsee-Zeitung über unsere Homepage.</dt>
<dt>
<a href="http://www.wollingster-see.de/news/show_news.php?subaction=showfull&id=1093386410&archive=&template=wosee" onclick="window.open(this.href, '_News', 'HEIGHT=500,WIDTH=545,resizable=yes,scrollbars=yes');return false;"
>24.08.2004</a>
</dt>
<dd>Gästebuch wieder freigegeben</dd>
<dt>
<a href="http://www.wollingster-see.de/news/show_news.php?subaction=showfull&id=1093377511&archive=&template=wosee"
onclick="window.open(this.href, '_News', 'HEIGHT=500,WIDTH=545,resizable=yes,scrollbars=yes');return false;"
>24.08.2004</a>
</dt>
<dd>Galerie wieder online!</dd>
<dt>
<a href="http://www.wollingster-see.de/news/show_news.php?subaction=showfull&id=1093211557&archive=&template=wosee"
onclick="window.open(this.href, '_News', 'HEIGHT=500,WIDTH=545,resizable=yes,scrollbars=yes');return false;"
>23.08.2004</a>
</dt>
<dd>Auftrieb der Schafe</dd>
</dl>
</body>
und der CSS Code so:
<style type="text/css">
body
{
font-family:Verdana;
font-size:80%;
color:#000;
background-color:#fff;
}
a:link { color:#000000; text-decoration:none; }
a:visited { color:#000000; text-decoration:none; }
a:active { color:#000000; text-decoration:none; }
a:hover { color:#FF9933; text-decoration:none; }
#linkeseite
{
width:131px;
background-color: rgb(239, 239, 239);
border-right:solid 1px #7F7F7F;
border-left:solid 1px #7F7F7F;
}
#linkeseite dl
{
text-align:center;
background-color:#fff;
}
#linkeseite dt
{
font-weight:bold;
background-color:#fff;
border-top:solid 1px #7F7F7F;
margin-top:10px;
}
#linkeseite dd
{
margin:0;
border-bottom:solid 1px #7F7F7F;
}
</style>
Das ganze könnte man sicher noch optimieren in Bezug auf den Rest der Seite, aber wie gesagt, das ist mir zu Zeitaufwendig, da der komplette code umgebaut werden müßte.
Ich hab keine Ahnung wie du deinen Stil verbessert könntest, aber mein Eindruck ist dass du zuviel willst. wie gesagt eine Seite fängt mit der HTML Struktur an, dann kommt das Design, dann lassen sich auch sehr flexibel Änderungen vornehmen. Deine Methode mit den unzähligen ineinander geschachtelten DIV's, CSS Klassen (die man in der Regel vermeiden kann und sollte), inline Styles ist nicht besonders flexibel und führt immer wieder zu Mißerfolg.
Struppi.