Tabellen Problem ..

Status
Nicht offen für weitere Antworten.
Hi,

du musst - gemäß dem Boxmodell - die padding-Werte von den Breitenangaben abziehen, damit du wieder auf 520 Pixel kommst, gleiches gilt auch für die Höhenangaben.

Wenn du den unteren grauen Rand abstellen willst, muß zum einen der untere Außenabstand von 15 auf 0 Pixel und zum anderen der untere Innenabstand von 6 auf 0 Pixel gesetzt werden:

Code:
h1 {
font-weight:bold; 
font-size:14px; 
margin:0 0 15px 0; 
text-align:center; 
border:0px solid #cccccc;
background-image:url(gfx/News-Banner-Anfang.jpg); 
padding:2px; 
width:516px; /* 520px - 2*2px = 516px */
height: 21px; /* 25px - 2*2px = 21px */
color:#666666;
background-repeat:no-repeat; 
}

h2 {
font-weight:bold; 
font-size:10px; 
margin:0 0 0 0;
text-align:center; 
border:0px solid #cccccc;
background-image:url(gfx/News-Banner-Ende.jpg); 
padding:6px 6px 0 6px; 
width:508px; /* 520px - 2*6px = 508px */
height:19px; /* 25px - 6px = 19px */
color:#666666;
background-repeat:no-repeat; 
}
 
kleine Anmerkung noch von meiner Seite:
Probier das doch mit Divs zu lösen, Tabellen sollte man nur für Tabellen brauchen, und nicht fürs Layout, das gibt immer nur Probleme,... Nur so als Verbesserungstipp ;)

MFG Adi
 
Hallo Du,

Ist gar nicht so schwer, bin vor langer Zeit auch von Tabellen auf DIV umgestiegen. War am Anfang etwas anderes, jedoch schon nach kurzer Zeit konnte ich mich daran gewöhnen.


Hab dir hier noch ein kleines Beispiel:

Das <div>-Tag ist ein Container für mehrere HTML-Elemente, denen durch die Kernattribute des <div>-Tags Stylesheet-Eigenschaften zugewiesen werden. div-Elemente sind Blockelemente, da das öffnende und das schließende <div>-Tag jeweils zu Zeilenumbrüchen – äquivalent zum <br />-Tag – führen. Ansonsten bringt ein div-Element keine weiteren Eigenschaft von sich aus ein.
<div>-Tags lassen sich ineinander verschachteln und bilden einen leistungsfähigen Mechanismus, mit dem jeder Bereich einer Webseite erreicht werden kann. In erster Linie wird das <div>-Tag dazu herangezogen, eine Menge von logisch zusammengehörigen HTML-Elementen mit der Hilfe von Cascading Stylesheets zu formatieren, positionieren oder mit JavaScript zu animieren. Dazu werden die Kernattribute class, id und style benutzt.
Äquivalent zum <div>-Tag gibt es das <span>-Tag, das benutzt wird, wenn einer Gruppe von HTML-Elementen Inlinestile – also Stile ohne Zeilenumbruch – zugewiesen werden sollen.

Kernattribute
Ereignisse
PHP:
<div id="nav" style="float: left; padding: 10px; width: 150px; background: rgb(220,230,220); border: 1px solid silver;">
    <p>erster Link</p>
    <p>zweiter Link</p>
</div>
<div id="content" style="float: left; margin-left: 15px; padding: 10px; width: 300px; border: 1px solid silver;">
    <p>Das <strong>div-Tag</strong> ist ein besonders aufregendes Konstrukt in HTML. </p>
    <p><span style="text-align: center;" id="beispiel2">Es strukturiert den Inhalt anderer Elemente, </span> <span style="text-align: right;" id="beispiel3"> die logisch zusammengehören und optisch herausgestellt werden.</span></p>
</div>


Quelle: http://www.mediaevent.de/xhtml/div.html



Grüsse,
Helium
 
Hi,

in dem vorliegenden Fall ist der Wechsel von der Tabelle zu einem DIV kein Hexenwerk ;)

Das Stylesheet wird mit der folgenden Regel erweitert:

Code:
div#box {
width:520px;
background:#cccccc;
}
und die Inhalte in dem DIV eingebettet:
Code:
<div id="box">
        <h1>Test News usw</h1>
        <p class="Content">Bundesverkehrsminister Wolfgang Tiefensee will die  Fluggesellschaften in den Klimaschutz einbinden. "Wir werden künftig die Landegebühren nach Emissionen staffeln", sagte er der "Welt" vom Montag. Bis zum Jahresende werde sein Ministerium entsprechende Schadstoffeckwerte erarbeiten. Geplant sei ein dreijähriger Feldversuch mit Fluglinien auf freiwilliger Basis. Für die Flugpassagiere solle dies "aufkommensneutral" bleiben, kündigte der SPD-Politiker in dem Zeitungsinterview an. Fluggesellschaften zeihen angeblich mit Beim Luftverkehr sei ein Bündel von Maßnahmen wie die Einbeziehung in den Emissionshandel, die Vermeidung von Warteschleifen über Flughäfen und die Neuordnung von Flugrouten nötig. "Das vermeidet täglich tausende Tonnen unnützer CO2-Emissionen", sagte Tiefensee. Bei den Fluggesellschaften erkenne er nach anfänglicher Ablehnung eine wachsende Zustimmung zum Emissionshandel.</p>
        <h2>Blablub usw</h2>
</div>
Und um den Textblock vom linken Elementrand einzurücken, geben wir der Klasse .Content einen entsprechenden Innenabstand mit auf den Weg:

Code:
p.Content {
font-family:Verdana,sans-serif; 
font-size:10px; 
width:400px; 
text-align:justify; 
padding: 0 50px; 
}
 
Vielen Dank für die Hilfe.
Aber dennoch habe ich erneut eine Frage zum Thema Tabellen.

Ich habe in einer Spalte ein Script, welches aber ganz oben in der Spalte laufen soll, nicht so wie bei mir in der Mitte. Habs mit align probiert da gibt es sowas wie align="top" nicht.

Könntet ihr mir da evtl mit eurer Kompetenz weiter helfen ?

Hier die Seite -> click


MfG
 
Hi,

du musst das Attribut valign verwenden, um den Zellinhalt vertikal auszurichten:

Code:
<td bgcolor="#E9E9E9" width="150" valign="top">
        <div id="Lay" class="Lay1"><div class="Lay2"><div class="Lay3" id="Inlay">
 
muchas gracias ^^

dachte mir schon das es sowas wie align sein musste :)
Nungut , ich bedanke mich nochmals bei allen die mir geholfen haben,
wen ich noch Probleme bei meiner Homepage haben sollte, denke ich werd ich es in den Thread hier reinschreiben. Hier wird einem einfach super geholfen.

MfG
 
Status
Nicht offen für weitere Antworten.
Zurück