Suche Hilfe bei Umbau auf CSS

[Matthias W. (matt007)]

Ich habe eine größere Homepage. Bisher waren Tabellen hart formatiert. 
Die font "size=2" Tags habe ich nun entfernt und auch die viele 
width-Befehle die in jedem td waren.

Es gibt ein übergeordnetes CSS-file, dessen Inhalte auch vom Server 
beachtet werden.

Nur leider zeigt der alte Dreamweaver 4 in den Tabellen die Schrift zu 
groß an. Das Editieren fällt so schwer, daher suche ich Abhilfe.

Über den Tabellen steht heute noch:

<table style="border-collapse:collapse" border="1" bordercolor="#c0c0c0" 
width="600">

Die Idee ist nun statt dieser dezentralen Festlegung bei table eine 
Klasse zu vergeben und diese über CSS zu definieren in der Art:

<table class="liste">

wobei im CSS dann etwas steht in der Art:

.liste table {
style="border-collapse:collapse"
border="1"
bordercolor="#c0c0c0"
width="600"
}

Leider kommt es dabei zu Problemen, die ich nicht so einfach lösen kann. 
Vielleicht hat jemand eine Idee woran das liegen kann.

[Matthias W. (matt007)]

Matthias W. schrieb:
> Leider kommt es dabei zu Problemen, die ich nicht so einfach lösen kann.

Problem 1:
Dreamweaver interpretiert nicht mehr in seiner Layout-Ansicht wie die 
Tabelle nun aussieht.

Problem 2:
Der Rahmen um die Tabelle verschwindet leider und ich weiß nicht warum 
das so ist.

Offensichtlich macht dieses CSS eben nicht genau dasselbe wie dieselben 
Anweisungen im table Tag. Vielleicht weiß jemand weiter?

[D. I. (Gast)]

Matthias W. schrieb:
> Offensichtlich macht dieses CSS eben nicht genau dasselbe wie dieselben
> Anweisungen im table Tag. Vielleicht weiß jemand weiter?

1. CSS lernen
2. Dreamweaver in den Abgrund der Hölle schicken
3. CSS lernen

[der mechatroniker (Gast)]

Steht im CSS wirklich genau das?

.liste table {
style="border-collapse:collapse"
border="1"
bordercolor="#c0c0c0"
width="600"
}

Dann kann (!) das gar nicht funktionieren.

Bezieht sich nämlich erstens auf eine Table, die innerhalb eines 
Elements mit Klasse "liste" steht.

Zweitens haben CSS-Auszeichnungen eine etwas andere Syntax, und manche 
Attribute auch andere Namen, z.B. m.W. border-width (statt border), 
border-color (statt bordercolor), usw.

[Matthias W. (matt007)]

der mechatroniker schrieb:
> Steht im CSS wirklich genau das?

im CSS habe ich schon viele Varianten versucht. Bisher leider ohne 
brauchbares Ergebnis.

Im Buch "CSS einfach erklärt" sind tables recht knapp abgehandelt. Im 
Internet fand ich Beispiele, an denen ich mich orientiert habe. Leider 
bisher nicht zielführend.

> Dann kann (!) das gar nicht funktionieren.

Bisher haben leider auch die diversen anderen Varianten nicht 
funktioniert. Daher suche ich etwas das definitiv geht.

> Bezieht sich nämlich erstens auf eine Table, die innerhalb eines
> Elements mit Klasse "liste" steht.

ich verstand den Sinn von <table class="liste"> so, daß dann 
insbesondere nur dieser table mit der Klasse "liste" die Formatierung 
aus der CSS-Datei übernimmt. Ist das denn nicht so? Habe ich das falsch 
verstanden?

> Zweitens haben CSS-Auszeichnungen eine etwas andere Syntax, und manche
> Attribute auch andere Namen, z.B. m.W. border-width (statt border),
> border-color (statt bordercolor), usw.

ich fand Beispiele wie

table, th, td {
border: 1px solid black;
border-collapse:collapse;
}

nur leider reagieren die Versuche mit CSS nicht so wie das was ich 
direkt in die Tabelle schreibe. Das Ganze sollte doch kein Hexenwerk 
sein?

Das sind doch keine hohen Ansprüche die ich da stelle. Es soll eine 
Tabelle sein, 600px breit, 3 Spalten, die erste soll 50px breit sein, 
die hintere 34px und die mittlere passt sich an. Eine feine Rahmenlinie 
soll rum, 1px breit.

[Matthias W. (matt007)]

D. I. schrieb:
> 1. CSS lernen

da bin ich ja dabei. Nur ist es frustrierend wenn selbst so einfache 
Dinge wie eine Tabelle mit einem dünnen Rand nicht so geht wie es gehen 
soll und der Grund dafür nicht offensichtlich ist. Dann heißt es suchen 
und fragen !

> 2. Dreamweaver in den Abgrund der Hölle schicken

was gibt es denn Besseres,
+ wo man den Code und das Design gleichzeitig in 2 Fenstern sehen und 
bearbeiten kann.
+ wo man über das ganze Projekt hinweg suchen und ändern kann.
+ wo man Tabellen einfach in der Layoutansicht editieren kann mit cut & 
paste.

Ich nehme den alten Dreamweaver seit Jahren und war bisher stets 
zufrieden weil er meiner Arbeitsweise sehr entgegenkam. Flott konnte ich 
damit Inhalte einpflegen.

[troll (Gast)]

Matthias W. schrieb:
> Im Buch "CSS einfach erklärt" sind tables recht knapp abgehandelt. Im
> Internet fand ich Beispiele, an denen ich mich orientiert habe. Leider
> bisher nicht zielführend.

Nur zur Sicherheit: de.selfhtml.org kennst du? Die haben doch bestimmt 
auch was über CSS.

[Matthias W. (matt007)]

troll schrieb:
> Nur zur Sicherheit: de.selfhtml.org kennst du? Die haben doch bestimmt
> auch was über CSS.

auch da habe ich geschaut. Bisher brachte mich das nicht weiter. Frust 
baute sich auf und der Wille das zeitnah zu lösen weil es doch nicht so 
schwer sein kann.

[Timmo H. (masterfx)]

Google mal nach "css table class"
Da findest du einige Beispiele.

[der mechatroniker (Gast)]

> ich verstand den Sinn von <table class="liste"> so, daß dann
> insbesondere nur dieser table mit der Klasse "liste" die Formatierung
> aus der CSS-Datei übernimmt. Ist das denn nicht so? Habe ich das falsch
> verstanden?

<table class="liste"> ... </table> definiert ein Table-Element, welches 
die CSS-Klasse "liste" besitzt.

Dein CSS-Selektor
.liste table
selektiert Table-Elemente (mit oder ohne irgendwelche Klassen), die sich 
im HTML-Elementebaum unmittelbar innerhalb eines Elements (gleich 
welchen Typs) mit Klasse liste befinden.

Z.B.
<div class="liste"><table> ... </table></div>

Der Unterschied ist klar?

Was du vermutlich meintest, war

table.liste

Das hast du aber in deinem CSS nun einmal nicht verwendet, also kann es 
auch nicht klappen.

[Jan H. (j_hansen)]

Hi! Ein kleiner Tipp: verwende Firefox mit Firebug, da siehst du genau 
welche Stilelemente von wo gezogen und überschrieben werden. Außerdem 
kannst du da direkt Elemente bearbeiten und siehst die Auswirkungen. Und 
natürlich die korrekten Bezeichnungen.

[Matthias W. (matt007)]

Jan Hansen schrieb:
> Hi! Ein kleiner Tipp: verwende Firefox mit Firebug,

vielen Dank für den Hinweis !

[Timmo H. (masterfx)]

Geht auch mit Google Chrome ohne zusätzliche Plugins. Einfach rechte 
Maustaste auf der Seite => Element untersuchen

[Matthias W. (matt007)]

In der Tabelle im Code steht nun:
<table class="symptome">

Im CSS steht nun:
table.symptome
{
border-collapse:collapse;
border: 1px solid #c0c0c0;
width: 600px;
}

So klappt es. Die Schrift in der Tabelle wird jedoch im Dreamweaver zu 
groß angezeigt - leider. Auf der Webseite dann ist es ok.

Im CSS steht zu #textbereich
{
font-size: 10pt;
}

muss das dann trotzdem noch für alle Tabellen extra definiert werden?
Die Tabellen stehen ja auch im Textbereich. Das müsste doch vererbt 
werden?

[Matthias W. (matt007)]

Timmo H. schrieb:
> Geht auch mit Google Chrome ohne zusätzliche Plugins. Einfach rechte
> Maustaste auf der Seite => Element untersuchen

Danke für den Hinweis.