Center in Tabelle

Ride

Hallo
Ich stehe gerade ein bisschen auf dem Schlauch
Ich habe eine Tabelle geschrieben die mir einen Text auf einer bestimmten Höhe zentrieren soll. Dies geschieht auch im IE, jedoch im Firefox ist das nicht der Fall. Ich selbst habe das Gefühl das ich etwas zweimal anweise und er dadurch in Konflikt kommt welche Anweisung er ausführen soll. Leider seh ich meinen Fehler nicht. Hoffe ihr könnt mir die Augen öffnen und zeigen wo mein Fehler liegt

&
<html>
<head>
<title>Stellen</title>
<style type="Text/CSS">
@import "formate.css";
</style>
</head>

<body background="stellenback.jpg">
<table width="130px" height="130px">
<tr style="position: absolute; top: 20px; left: 10px;">
<td class="titel" align="center">Stellen</td>
</tr>
<tr>
<td><p class="smalltext">Zur Zeit haben wir keine offenen Stellen zu vergeben</p></td>
</tr>
</table>
</body>
</html>
;

Hier noch die .css dazu:

.titel { font-size:10pt;
         color:#000000;
         font-family:Verdana;
    font-weight:bold;}

Zentriert werden soll der Titel also "stellen".

Es grüsst
Ride

squee

Hallo Ride,

also ich empfehle dir als erstes mal deinem HTML Dokument eine DTD
http://de.wikipedia.org/wiki/Document_Type_Definition
zu geben.

In deinem Fall am Besten diese hier:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
     "http://www.w3.org/TR/html4/loose.dtd">

Damit nun der Titel zentriert wird kannst du z.B. so vor gehen:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
     "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Stellen</title>
<style type="Text/CSS">
@import "formate.css";
</style>
</head>

<body background="stellenback.jpg">
<table width="130px" height="130px">
<tr>
[b]<td class="titel">Stellen</td>[/b]
</tr>
<tr>
<td><p class="smalltext">Zur Zeit haben wir keine offenen Stellen zu vergeben</p></td>
</tr>

</table>
</body>
</html>

.titel { font-size:10pt;
         color:#000000;
         font-family:Verdana;
    font-weight:bold;
[b]text-align:center;[/b]}

Ich habe das align="center" aus dem HATML raus genommen und ins CSS geschrieben.

Noch so als kleiner Tipp. So was wie "<body background="stellenback.jpg">" oder "<table width="130px" height="130px">" ist nicht mehr aktuell. Am besten du erstellst für den Body und die Tabelle eine extra Klasse in der du die Angaben definierst. http://de.selfhtml.org/navigation/css.htm

Versuche Struktur und Layout zu trennen.

mfg
squee

Ride

Hallo
Vielen dank für die Tipps.
Wie ich gemerkt habe hast du das -->style=" position...<-- entfernt.
Dies diente dazu das der Titel an einer bestimmten Stelle im Iframe steht. Also von der Höhe aus gesehen. Wenn ich das nicht definiere ist, entweder der Titel oder sonst der darunterstehende text zu weit unten ( siehe http://img36.imageshack.us/img36/9899/stellenbsp.jpg)

Kannst du mir da villeicht auch weiter helfen?

mfg Ride

squee

Klar kann ich da weiter helfen.

Also dein Problem ist, dass das p je nachdem welchen Browser du verwendest schon voreingestellte Abstände (css->margin) hat.

willst du den Abstand dort verkleinern musst du in die Klasse .smalltext ein margin-top:0px rein schreiben.

Das sollte erstmals dein Abstandsproblem zwischen Titel und Text regeln.

btw.

du solltest beim erstellen einer Webeite erst einmal dafür sorgen, dass du einen "Browserreset" mit CSS machst so, dass die Standards jedes Browsers mit deinen Angaben überschrieben werden. Dadurch löst du sehr viele Probleme schon vor der Entstehung.

html
{
min-height:100%;
margin-bottom:1px;
background-color:transparent;
}
html, body
{
width:100%;
background-color:transparent;
font-size:12px;
}
body,div,table,tr,th,td,form,img,p,h1,h2,h3,h4,h5,h6,a
{
margin:0px;
padding:0px;
border:0px none transparent;
background-color:transparent;
font-family:verdana;
line-height:20px;
font-weight:normal;
color:#1b1b20;
text-decoration:none;
vertical-align:top;
}

Ride

Ich habe Versucht wozu du mir geraten hast. Als ich das "margin-top:0px" eingefügt habe hat sich leider nicht sehr viel verändert . Der Text ist max um 3px nach oben gekommen :-/...
War das bei genau so oder habe ich etwas vergessen?

mfg Ride

PS:
Wegen dem "Browserreset": Ist sehr gut zu wissen. Jedoch ist die ganze Homepage recht gross, und als ich es in die css genommen habe hat es mir natürlich verständlicherweise mal die ganze seite zerschossen (Formatierung gemeint damit). Deshalb werde ich diese erst dan ab version 1.1 einbauen die ich in einigen Wochen vervollständigen werde.

squee

Mal ne kurze Frage, ich habe da im Webzeugs ne andere Frage von dir gefunden.
Machst du das ganze mit nem Frameset?

So, am besten installiest du dir Firebug auf deinem FF damit Kannst du dann deine komplette Seite mit CSS und HTML zerlegen und rausfinden wie der Abstand zu stande kommt.

Ride

Ja das ganze bassiert auf meheren Iframes die dazu dienen sollen, gewisse Bereiche die der Nutzer immer wieder ändern möchte, einfach zugänglich zu machen.
Danke für den Tipp mit Firebug. Sehr nützlich. Ich habe es im moment so gelöst das ich die gesamte Table kleiner gemacht habe und so der Browser der Text zusammengeschoben hat. Ist leider nicht gerade die Optimale lösung aber im moment tut sie ihren Zweck.

squee

Hm, ich verstehe den Sinn der Frames leider nicht ganz.

Also ein Tipp für die Zukunft. Frames sind böse !

Frames kann man klauen, zerlegen und Suchmaschienen können damit nichts und wenn dann nur Wenig mit anfangen.

Am besten löst man Aufgaben bei denen mehrere Frames in Frage kommen könnten mit includes. Dann ist dein Loginscript schon viel ... viel einfacher zu gestalten.

Ride

Achtung die beiden Posts beziehen sich auf verschiedene Homepages
Das hier hat nichts mit dem Loginscript zu tun
Die Frames sollen in diesem Fall dazu da sein um es den Kunden zu ermöglichen ohne wesentliche IT kenntnisse seine News und seine aktuell freien Stellen abzuändern.
Wenn ich dafür ein eigenes Frame habe geht das meiner Meinung nach sehr einfach. Da muss ich dem Kunden nur zeigen wo er schreiben darf und das wars.
Ich werde aber deinen Tipp gerne berücksichtigen und das nächste mal ohne frames ans werk gehen und dafür etwas anderes benutzen.

Hallo,

würde hinter der Seite eine Datenbank liegen könntest du den ganzen Content in die Datenbank packen und über ein Backend dem Nutzer ermöglichen den Content zu bearbeiten ohne dass er HTML - Kentnisse haben muss. Seiten selbst muss er dann auch nicht mehr bearbeiten. (CMS-Prinzip)

LG, Micha

squee

Jop, in dem Fall würde ich auch zur datenbank raten.

Wenn der Benutzer dann auch noch ordentliche Eingaben machen soll die danm irgendwie im html wieder ausgegeben werden kannst noch den tinymce WYSIWYG Editor mit einbinden. Das geht sehr einfach.

http://tinymce.moxiecode.com/