zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Suche Hilfe bei Umbau auf CSS

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.06.2013, 20:55
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.05.2013
Beiträge: 38
matt007 befindet sich auf einem aufstrebenden Ast
Standard Suche Hilfe bei Umbau auf CSS

Ich habe eine größere Homepage. Bisher waren die langen Tabellen hart formatiert. Die font "size=2" Tags habe ich nun entfernt und auch die vielen width-Befehle die in jedem td waren. Es reicht ja ein einziger width-Befehl für jede Spalte.

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.

Problem 1:
Dreamweaver interpretiert nicht mehr in seiner Layout-Ansicht wie die
Tabelle nun aussieht, was das Arbeiten sehr erschwert.

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

Offensichtlich macht dieses CSS nicht genau dasselbe wie dieselben
Anweisungen im table Tag. Vielleicht weiß jemand weiter?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 03.06.2013, 21:07
Benutzerbild von Manfred62
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2009
Ort: Ludwigsburg
Beiträge: 2.134
Manfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nett
Standard

hmm, die Basics lernen kann nicht schaden.
Code:
.liste { /* oder table .liste */
border-collapse: collapse;
border: 1px solid #c0c0c0;
width: 600px;
}
Little Boxes Teil 1 kostenlos online lesen - Little Boxes - Webseiten gestalten mit HTML und CSS (Peter Müller)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 03.06.2013, 21:54
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.05.2013
Beiträge: 38
matt007 befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für das hilfreiche Beispiel !

Ich habe nun Folgendes versucht:

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;
}

Der table wird auch korrekt angezeigt - nur leider ohne den Rahmen !
Woran kann das liegen?

Das CSS-file ist als "UTF-8 ohne BOM" eingestellt.
Umschaltung auf "ANSI" bewirkt keinen Unterschied.
Das CSS-file habe ich als SSI eingebunden weil der übliche Weg nicht zu funktionieren schien.
Mit Zitat antworten
  #4 (permalink)  
Alt 03.06.2013, 22:44
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

table .symptome

table.symptome

Dreamweaver4 stammt aus dem Jahre 2000 und ist total veraltet.
Benutze einen anständigen Editor, wie PSPad oder Notepad++ und schau dir die Ergebnisse im Firefox an.
Zum Sicherstellen, dass dein Code keine Fehler hat, kannst du das Html durch den The W3C Markup Validation Service schicken.
Für CSS verwende ⇒The W3C CSS Validation Service
Die Fehlerkonsole in Firefox ist auch eine gute Quelle um Fehler angezeigt zu bekommen.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
  #5 (permalink)  
Alt 03.06.2013, 22:48
Benutzerbild von Manfred62
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2009
Ort: Ludwigsburg
Beiträge: 2.134
Manfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nett
Standard

stell dein Beispiel mal online (z.b. Freehoster).
einfaches Beispiel:
HTML-Code:
<!DOCTYPE html>
<html lang="de">
<head>
	<meta charset="UTF-8">
	<title>Tabelle</title>
	<style type="text/css">
	body {
		font: 100%/1.5 sans-serif;
	}
	table {
		border-collapse: collapse;
		border: 3px solid #ccc;
	}
	td {
		padding: 10px;
	     /*border: 1px solid #000;*/
	}
	</style>
</head>
<body>
	<table>
		<tr>
			<td>Irgendein Inhalt<br>Irgendein Inhalt</td>
			<td>Irgendein Inhalt<br>Irgendein Inhalt</td>
		</tr>
		<tr>
			<td>Irgendein Inhalt<br>Irgendein Inhalt</td>
			<td>Irgendein Inhalt<br>Irgendein Inhalt</td>
		</tr>
	</table>
</body>
</html>
Mit Zitat antworten
  #6 (permalink)  
Alt 03.06.2013, 23:01
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.05.2013
Beiträge: 38
matt007 befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank ! Mit table.symptome geht es.

Nur leider ist im Gegensatz zur Definition in der Ursprungszeile <table border=1 ....> nun mit dem CSS nur noch der äußere Rahmen der Tabelle da. Die Rahmenlinien um die einzelnen Elemente fehlen.

Muss ich nun für jede td noch eine eigene Klasse vergeben um diese fehlenden Rahmenlinien noch zu bekommen? Da käme der Speck auf die Würscht.

Gibt es eine einfache Möglichkeit in CSS die Breite der Spalten direkt im table anzugeben?

Als Editor habe ich auch Notepad+. Allerdings schätze ich am Dreamweaver bis heute sehr:
+ dass man den Code und das Design gleichzeitig in 2 Fenstern sehen und
auch bearbeiten kann.
+ daß man über das ganze Projekt hinweg suchen und leicht ändern kann.
+ daß 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.
Mit Zitat antworten
  #7 (permalink)  
Alt 03.06.2013, 23:12
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.05.2013
Beiträge: 38
matt007 befindet sich auf einem aufstrebenden Ast
Standard

Hallo Manfred,

ich habe das hochgeladen auf Alternative Medizin: Albert Abrams.

Leider ist im Vergleich zur bisherigen Fassung Alternative Medizin: Albert Abrams das Layout nun ziemlich zerrissen. Keine Ahnung wie viel Aufwand nötig ist das zu flicken. Die Lösung ohne CSS hatte auch ihre Vorteile. Alles war da direkt in der obersten Tabellenzeile angegeben. Nur noch 2 Breiten-Befehle in die td - und das war es dann.

Vielleicht gibt es ja auch mit CSS einen platzsparenden Weg.
Mit Zitat antworten
  #8 (permalink)  
Alt 03.06.2013, 23:52
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von matt007 Beitrag anzeigen
Muss ich nun für jede td noch eine eigene Klasse vergeben um diese fehlenden Rahmenlinien noch zu bekommen? Da käme der Speck auf die Würscht.
Nein.

Beispiel: Rahmen um Tabelle und Zeilen
HTML-Code:
table.symptome, table.symptome tr {
    border: 1px solid #c0c0c0;
}
Rahmen nur um Tabellenzellen ohne Überschriften
HTML-Code:
table.symptome td {
    border: 1px solid #c0c0c0;
}
Rahmen um Tabellenüberschrift und Tabelle
HTML-Code:
table.symptome th, table.symptome {
    border: 1px solid #c0c0c0;
}
Rahmen um Tabelle, Tabellenüberschrift, -Zeilen und Zellen
HTML-Code:
table.symptome, table.symptome th, table.symptome tr, table.symptome td, {
    border: 1px solid #c0c0c0;
}

Zitat:
Gibt es eine einfache Möglichkeit in CSS die Breite der Spalten direkt im table anzugeben?
ja, so wie oben mit den Rahmenbeispielen.
Für Ausnahmen nimmt man eine Klasse.
Beispiel: alle Zellen 40 Pixel Breit und letzte Spalte 60 Pixel.
HTML-Code:
/* CSS */
table.symptome td {
    width: 40px;
}
table.symptome td.extrabreit {
    width: 60px;
}
HTML-Code:
<table class="symptome">
            <th>Uebers.1</th><th>Uebers.2</th><th>Uebers.3</th>
            <tr><td>Zelle1</td><td>Zelle2</td><td class="extrabreit">Zelle3</td></tr>
            <tr><td>Zelle4</td><td>Zelle5</td><td>Zelle6</td></tr>
</table>


Zitat:
Ich nehme den alten Dreamweaver seit Jahren und war bisher stets
zufrieden weil er meiner Arbeitsweise sehr entgegenkam. Flott konnte ich
damit Inhalte einpflegen.
Schau dir mal den Kompozer an, als Alternative sozusagen.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
  #9 (permalink)  
Alt 04.06.2013, 00:52
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 31.05.2013
Beiträge: 38
matt007 befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für die prima Beispiele. Das probiere ich aus !
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
css, dreamweaver, layout, tabelle, table

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Hilfe bei CSS Navigation trimalchio CSS 7 10.01.2011 14:13
Hilfe bei CSS Desing Umsetzung. Frosti1986 CSS 7 27.02.2010 14:08
CSS Experten Hilfe benötigt! klappauge CSS 10 25.11.2007 14:37
Css navi problem IE 6 HILFE.... slave (X)HTML 9 28.10.2007 14:07
hintergrund bei css dateien weiss ... brauche hilfe deadmeiker CSS 0 02.09.2006 16:22


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:14 Uhr.