✔ Tabelle nicht zentriert

Status
Nicht offen für weitere Antworten.
G

GFX-Händchen

Erfahrenes Mitglied
Hi,

ich bin noch Anfänger in Sachen HTML und CSS und habe jetzt ein Problem.
Meine Tabelle will sich einfach nicht auf die Mitte der Seite zentrieren lassen.:(
D.h. meine Tabelle ist immer links auf der Seite.:eek:

Wo liegt der Fehler?:confused:

Weiteres Problem:
Ich möchte nur den Satz Erstes Treffen seit 10 Jahren! kursiv haben, doch bei mir macht er alles kursiv weil das </p> ja erst zum Schluss kommt.:rolleyes:

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

	<head>
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<meta name="generator" content="Adobe GoLive" />
		<title>Unbenannte Seite</title>
		<style type="text/css">
		<!--
		body {text-align: center;}
		span {font-weight: bold;}
		#kursiv	 {font-style: italic;}
		div	{text-align: center;}
		-->
		</style>
	</head>

	<body>

<p>Treffen<p>
<div>
<table>
  <tr>
    <td><span>Wann:</span></td>
    <td> irgendwann</td>

  </tr>
  <tr>
    <td>
    <p><span>Wo:</span></td>
    <td>irgendwo</td>
  </tr>
  <tr>

    <td>
    <p><span>Beginn:</span></td>
    <td>steht noch nicht fest</td>
  </tr>
  </table>
  </div>
<p id="kursiv"><span>Erstes Treffen seit 10 Jahren!</span><br>
(Eintritt frei)<br>
<br>Für leibliches Wohl ist bestens gesorgt</p>
<p>Infos und Anmeldung unter: 0815</p>

</body>

</html>
 
Hi,

mit
Code: 
<table style="margin:0 auto;">
lässt sich die Tabelle in den nicht-IE-Browsern horizontal zentrieren.

Das zweite Problem lässt sich ganz einfach beheben, indem du die ID #kursiv im span-Element notierst:
Code: 
<p><span id="kursiv">Erstes Treffen seit 10 Jahren!</span><br>
(Eintritt frei)<br>
<br>Für leibliches Wohl ist bestens gesorgt</p>
 
Danke.:)
Nun ist es aber noch so, dass die Worte Wann, Wo, Beginn auch zentriert sind.
Besser würde es aussehen, wenn die Anfangsbuchstaben untereinander stehen würden und vom nachfolgenden Text (in jeweils der gleichen Zeile) auch die Anfangsbuchstaben untereinander wären.;)
Kann amn das auch noch lösen?:confused:


Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

	<head>
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<meta name="generator" content="Adobe GoLive" />
		<title>Unbenannte Seite</title>
		<style type="text/css">
		<!--
		body {text-align: center;}
		span {font-weight: bold;}
		#kursiv	 {font-style: italic;}
		
		-->
		</style>
	</head>

	<body>

<p>Treffen<p>

<table  style="margin:0 auto;">
  <tr>
    <td><span>Wann:</span></td>
    <td> irgendwann</td>

  </tr>
  <tr>
    <td>
    <span>Wo:</span></td>
    <td>irgendwo</td>
  </tr>
  <tr>

    <td>
    <span>Beginn:</span></td>
    <td>steht noch nicht fest</td>
  </tr>
  </table>
  
<p><span id="kursiv">Gebrauchtes und fast neues<br>
für Jedermann!</span><br>
(Eintritt frei)<br>
<br>Für leibliches Wohl ist bestens gesorgt</p>
<p>Infos und Anmeldung unter: 0815</p>

</body>

</html>
 
Hierfür kannst du folgende Regel deklarieren:

Code: 
td { text-align:left; }
Wenn die Regel nur für bestimmte Tabellenzellen gelten soll, differenzierst du sie mit Hilfe einer Klasse:

Code: 
td.left { text-align:left; }
Code: 
<td class="left">...</td>
 
Danke.:)
Das mit
Code: 
td { text-align:left; }
war für mich schon das richtige.;)

Ähm, jetzt hätte ich vorerst noch ein was.;-)
Habe jetzt probiert das der Text in der Tabelle nach dem Doppelpunkt etwas Abstand hat und habe dazu das
Code: 
padding: 10px;
noch in den td-Code im CSS-Bereich eingefügt (siehe unten), doch dann habe ich wieder Leerraum/Leerzeilen zwischen den einzelnen Worten Wo, Wann und Beginn.:(

Code: 
td { text-align:left; 
     padding: 10px;}
 
Probier's mal mit padding-left:10px.

Wenn die Regel nur für die jeweils benachbarte Zelle gelten soll, lässt sich dies wieder mit einer entsprechenden Klasse einrichten.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück