2 CSS-Dateien in einem HTML-Dokument

Hallo,
ich programmiere eifrig an einer neuen Internetseite und bin heute auf ein Problem gestoßen, welches ich nur mit Mühen lösen könnte. Daher bitte ich die Community um Hilfe.

Meine Internetseite besitzt einen Style, der mit einer CSS-Datei funktioniert. Nun möchte ich eine Tabelle einbauen, die auch eine CSS-Datei benötigt. Nun überschreiben sich die CSS-Dateien aber gegenseitig und der Style wird fehlerhaft. Mit iFrame möchte ich das nicht machen und ich hörte, es gäbe eine Möglichkeit, mit IDs zu arbeiten. Wie muss ich das anstellen?

hallo,
Evtl. andere Namen nehmen?
z.B. anstatt #table, @table_1 nehmen.

Hast evtl. den Link zur der Seite?

Nein, die Seite ist im Moment offline (auf meinem PC)
Ich hatte mich bei meinem Text verschrieben (was ich bereits verbessert habe). Die CSS-Dateien überschreiben sich, und somit besitzt die Tabelle keine richtige Anordnung mehr und auch der Seitenstyle spielt verrückt (weil sich ja die Informationen überschreiben). Dafür gibt es eine Lösung, dass man mit IDs arbeitet, doch davon habe ich keine Ahnung und benötige dazu Informationen.

Wenn du gerne liest könntest du bei css4you.de nach schauen. ( css4you.de/wscss/css01.html )

tiptom.ch/tests/css_test/css_intro.html

Das ist auch eine ganz brauchbare Quelle…

Ich ging extra in ein Forum, weil ich bereits bei Google.de geguckt habe und nach ewiger Suche nur mäßige Informationen erhalten habe…

Fazit: Ich hätte das gerne von einem Menschen erklärt, nicht von einer Internetseite, sonst hätte ich hier nicht posten müssen.

Danke dennoch, aber ich lese nicht 10 Seiten Text, der teilweise so umständlich geschrieben ist oder nicht mein Problem behandelt…

Hi,

erkläre doch bitte mal wieso du nicht gewillt bist dir ein wenig Text durchzulesen, der deinen Problemfall schon erklärt. Anstelle dessen möchtest du es hier von einem User vorgekaut bekommen, der im Prinzip genau das gleiche schreibt.

Ich habe mir deinen Link angeschaut und als ich ihn überflogen habe, sah ich keinen Beitrag, der mein Problem behandelt! (Suchbegriffe bei Google.de helfen auch nur mäßig)

Wie erwähnt suchte ich bereits recht lange nach brauchbaren Informationen und musste mich schlussendlich an ein Forum wenden. Hier möchte ich nicht, dass man mir einen Link zu einer Seite schickt (index) und ich mich schon wieder auf die Suche machen muss (themenbezogener Link wäre praktischer, also: …/2cssin1html.html oder dergleichen.)

Zudem kann ein Forennutzer viel besser auf individuelle Probleme eingehen, als eine statische Internetseite.

[quote=“Realtek”]
Zudem kann ein Forennutzer viel besser auf individuelle Probleme eingehen, als eine statische Internetseite.[/quote]
Stimmt, nur bitte beschreibe dein Problem genau oder Post evtl. die “Code” dazu oder auch die ganze css Datei(en) + html Datei(en) besser wäre es aber schon sogar auf bplaced.net hoch zuladen :slight_smile:

Ich weiß nicht, wie genauer ich das noch erklären soll…

Der Style meiner Internetseite funktioniert mit einer CSS-Datei. Fehlt diese oder ist diese fehlerhaft, ist automatisch der Style fehlerhaft.

Um Informationen dazustellen, möchte ich in einigen HTML-Dokumenten mit Tabellen arbeiten. Damit diese richtig angeordnet sind etc. benötige ich für diese ebenfalls eine (andere) CSS-Datei.

Da in den beiden CSS-Dateien jedoch teilweise für die gleichen Befehle (z.B. Textfarbe) aber unterschiedliche Angaben drinstehen, überschreiben sich die CSS-Dateien gegenseitig und es kommt zu fehlern auf der gesamten Seite, was eine logische Konsequenz daraus ist, dass die eine CSS-Datei NUR für die Internetseite gedacht ist, und die andere CSS-Datei NUR für die Tabelle gedacht ist aber in der Praxis wird versucht, beide CSS-Dateien, gleichzeitig für beides (also für Internetseitenstyle und Tabelle) zu benutzen.

Und nun wäre es nützlich wenn du uns Teile der CSS zur Verfügung stellst. Besonders diese, die sich überlappen.

[quote=“Realtek”]
Da in den beiden CSS-Dateien jedoch teilweise für die gleichen Befehle (z.B. Textfarbe) aber unterschiedliche Angaben drinstehen, überschreiben sich die CSS-Dateien gegenseitig und es kommt zu fehlern auf der gesamten Seite, was eine logische Konsequenz daraus ist, dass die eine CSS-Datei NUR für die Internetseite gedacht ist, und die andere CSS-Datei NUR für die Tabelle gedacht ist aber in der Praxis wird versucht, beide CSS-Dateien, gleichzeitig für beides (also für Internetseitenstyle und Tabelle) zu benutzen.[/quote]

hmm, also müsstest du mit class="" oder id="" Arbeiten,
id=“deineid” darfst du nur 1xmal in der ganzen Seite verwenden (z.B. Footer)#deineid {css code ..}
class=“deineklasse” kannst du unbegrenzt mal in deiner Seite verwenden.deineklasse { css code ..}

//edit: wenn du in einer id oder classe “color: #000000;” definierst wird auch die Schrift Schwarz angezeigt.

Genau das wollte ich wissen (sollte der Quelltext benötigt werden, poste ich ihn, aber vielleicht lässt sich das Problem so lösen.)

Das mit der ID bzw. mit der Klasse habe ich auch gelesen, doch weiß ich nicht, wie ich das anzuwenden habe. Wo z.B. soll ich den Befehl #xyzKlasse hinschreiben und wie “weiß” das System dann, dass diese CSS-Datei nicht für den Style zu benutzen ist, sondern für die Tabellen (?)


[code].xyzKlasse { css code }[/code][code]<div class="xyzKlasse"></div>[/code]

der Code oben wahr faltsch..sry  :unamused:

der Code oben wahr faltsch…sry :unamused:

Brauche diesbezüglich wohl nochmal eine exakte Angabe… Jetzt treten andere Fehler auf, aber immer noch schwerwiegende Fehler… hiermit mal die Quelltext (kompiermiert fürs Forum) des HTML-Textes und der CSS-Datei.

CSS-Datei

[code].tableclass{
Body { FONT-SIZE: 10px;
font-family: verdana;
color: #373737;
text-align: left;
background:#ffffff;
scrollbar-DarkShadow-Color:#ffffff;
scrollbar-Track-Color:#ffffff;
scrollbar-Face-Color:#ffffff;
scrollbar-Shadow-Color:#ffffff;
scrollbar-Highlight-Color:#ffffff;
scrollbar-3dLight-Color:#ffffff;
scrollbar-Arrow-Color:#3F76A4; }

p, td { font-size: 10;
font-family: verdana;
color: #373737;}

Und so weiter und so fort (Restlichen Quelltext gelöscht!!)

} [/code]

HTML-Datei (NUR FÜR TABELLE)

[code]

Und so weiter und so fort. (Restlichen Quelltext gelöscht!!)

[/code]
p, td { font-size: 10;
    font-family: verdana;
    color: #373737;}

würde das nun mit classen machen.

td.deineklasse{ 
font-size: 10;
font-family: verdana;
color: #373737;
}

nun kannst du das so benutzten:

<table>
 <tr>
  <td class="deineklasse"></td>
 </tr>
</table>

wenn du nur das “td” oder “body” definierst kommt es nicht gut raus.
p.s: lösch am anfang das “.tableclass{” + am ende das “}” raus, bitte lese dich mehr in css ein de.selfhtml.org/css/ .

Habe es versucht, aber es hat nicht funktioniert. Es waren nachwievor Formatierungsfehler vorhanden, daher habe ich mich jetzt für eine andere Variante entschieden, die zwar einen Tick mehr Speicherplatz braucht, aber wenigstens unumständlicher ist.

Für alle die, die ähnliche Probleme haben, kann ich nur raten:
Erstellt ein neues HTML-Dokument, in der beispielsweise nur die Tabelle drin steht (ohne Internetseite etc.) und baut diese dann mittels iFrame passend in eure Seite, mittels folgenden Quelltext ein:

Wählt die Höhe (height) genau so, dass alles in der iFrame Einbindung zu sehen ist. Durch scrolling="no" entsteht so auch nicht der Platzhalter für den Scrollbalken, der bei der richtigen Größe ja nicht mehr notwendig ist.

Somit gibt es keinerlei Probleme mit den zwei (oder mehreren) *.css Dateien und man merkt nicht bzw. kaum, dass mit iFrame gearbeitet wurde. Einziger Nachteil, es benötigt mehr Speicherplatz.

Werde das jetzt auch so machen, von daher hat sich dieses Thema erledigt. Dennoch danke, für die Hilfen.

Bedenke aber, dass genau passende IFrames ohne Scrolling möglicherweise bei Usern mit größerer Schrift den Content nur teilweise anzeigen.

Daran habe ich jetzt zwar nicht gedacht, doch ich denke mal, dass ein sehr hoher Prozentsatz die Standardschriftgröße und Art eingestellt hat, falls nicht, gebe ich dies noch einmal expliziet an, mit welchen Explorern und welchen Schriftgrößen gearbeitet wurde.

Ich persönlich finde, dass es so eigentlich jetzt die unkomplizierteste Lösung ist, wodurch ich den bereits komplett geschriebenen Quelltext ändern muss.

EDIT: Wie ich grad bemerkt habe, verändert sich die Seite + die Tabellen und das iFrame mit, wenn ich Schriftart oder Schriftgröße verändere bzw. Zoom verändert das gesamte Fenster und die Schriftgrößenveränderung oder dergleichen wirkt sich nur auf die Seite, nicht aber auf das iFrame und dem Inhalt aus… Zumindest bei Mozilla und IE. Insofern also kein Problem.

Dein Problem ist so Grundlage von CSS, wenn du dir die Seiten die dir so freundlich verlinkt wurden einmal durchlesen würdest, würdest du das auch verstehen.

HTML:

<html>
<head>
link zu css1
link zu css2
</head>
<body>
<div class="text">
  roter text
</div>
<table class="taballe">
  <tr><td>blauer text</td></tr>
</table>
</body>
</html>

css1

.text {
  color:red;
}

css2

.tabelle {
  color:blue;
}

.klassenname legt die Eigenschaften für eine Klasse fest, die du im HTML mit class=„klassenname“ bestimmt hast.
Du kannst beides auch in eine CSS Datei schreiben.

//edit
Mir ist gerade aufgefallen, ich hab da wohl die ganze 2te Seite übersehen :ps: