• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

tabellenpositionierung: valign-befehl, weniger als 20px und blind.gif geht alles nich

Status
Für weitere Antworten geschlossen.
A

Athan

Guest
hi,

das ist ätzend:

ich möchte nichts weiter, als 5 buttons in einer horizontalen nav-leiste positionieren. die ist der hintergrund einer zelle in einer tabelle und 800px breit und 60px hoch. die buttons sollen 5px von oben und mit jew. 5px abstand zueinander stehen:



als erstes habe ich "über" diesen hintergrund eine neue tabelle gelegt, die diese zelle in 12 neue zellen unterteilt: 5 für jeden button (154px breit, 30px hoch), 6 für die 5px abstand und eine für untendrunter. dann mussten die buttons natürlich am unteren ende ihrer zelle (valign="bottom") sein. das hat soweit in phase 5 und dem ie auch geklappt, allerdings scheint firefox den valign-befehl nicht zu verstehn? :?

dann habe ich eben noch eine 13. zelle obendrübergelegt, damit die buttons garnicht anders können, als an der richtigen position zu sitzen, da ihre zelle nur so groß ist wie sie selbst (154px breit, 25px hoch). dafür muss diese obere zelle allerdings 5px hoch sein, aber irgendwie geht nicht weniger als 20? :?

dann habe ich in verschiedenen foren (zB https://www.dreamworker.de/foren/showthread.php?t=4419) gelesen, ich solle eine 5px hohe blind.gif einfügen, was allerdings nicht funktioniert hat (weder in der phase5-vorschau, noch in ff oder ie)? :?

was habe ich falsch gemacht und wie zum himmel geht es richtig??^^
 
was habe ich falsch gemacht
So ziemlich alles...

Tabellen sind der der völlig falsche Weg, wie du jetzt gemerkt haben dürftest. Die sind für tabellarische Daten vorgesehen und nicht fürs Layout.

Abstände werden mit margin und padding per CSS gemacht, nicht mit gifs.

und wie zum himmel geht es richtig??^^
Mit einer Liste (ul, ol oder dl).

Code:
<ul id="navigation">
  <li>Link</li>
  <li>Link</li>
  <li>Link</li>
</ul>
Per CSS bringst du dann die Listenelemente nebeneinander
Code:
ul#navigation li {float: left;}
gibst ihnen den von dir gewünschten Abstand zueinander
Code:
ul#navigation li {margin-right: 5px;}
und den gewünschten Abstand nach oben
Code:
ul {padding-top 5px; height: 2em;}
So sollte das grob aussehen, habs nicht getestet.
 
danke für die schnelle antwort

naja mit css kann ich bis jetzt leider nix anderes als schrift zu definieren.
das ganze ist ne ha aus der schule und wir sollen das mit tabellen machen (ich weis, das könnt ihr alle nicht ab, aber ich kann es leider auch nicht ändern), bis jetzt können wir es nicht anders.

gibt es keine alternative für den valign-befehl, mit dem auch ff klarkommt? ich meine selbst wenn ich die tabellen wie vorgesehen nutzen würde, müsste es doch irgendwie möglich sein, etwas am unteren rand einer zelle zu positionieren oder!? :roll:

mfg
 
danke für die schnelle antwort
Nichts zu danken.

naja mit css kann ich bis jetzt leider nix anderes als schrift zu definieren.
Das ist ja nicht schlimm, jeder hat mal klein angefangen.

das ganze ist ne ha aus der schule und wir sollen das mit tabellen machen (ich weis, das könnt ihr alle nicht ab, aber ich kann es leider auch nicht ändern)
Lass mich mal raten, der Lehrer ist schon etwas älter und hat sein Wissen aus den 90er Jahren. HTML ist einzig und allein dazu da, deinem Inhalt eine Bedeutung zu geben, Überschriften als <h1>-<h6> zu kennzeichnen, Textabsätze als <p>, Listen und Navigationen als <ul>, <ol> oder <dl>. Aber wenn du hier schon etwas im Forum gelesen hast, weißt du das ja sicher schon.

bis jetzt können wir es nicht anders.
Dann überrasche deinen Lehrer mal mit etwas neuem und weise ihn freundlich darauf hin, dass HTML nicht für das gedacht ist, wofür er es euch verwenden lässt. Tabellen sind nur für tabellarische Daten (Ergebnistabellen, Statistiken usw.)


gibt es keine alternative für den valign-befehl, mit dem auch ff klarkommt? ich meine selbst wenn ich die tabellen wie vorgesehen nutzen würde, müsste es doch irgendwie möglich sein, etwas am unteren rand einer zelle zu positionieren oder!? :roll:
Ja, CSS!
vertical-align: Vertikale Ausrichtung: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

Grundsätzlich gilt:
  • HTML für die Semantik
  • CSS fürs Layout
 
älter is er, ja, aber nicht von gestern +g
er wollte uns das erstmal mit tabellen machen lassen, weil es (wie er sagt) für den anfang einfacher ist, als div (was nächstes halbjahr kommt). er rechnet allerdings auch damit, dass wir stinknormale links für die navigation verwenden und nicht wie ich (:roll:) mouse-rollover-bilder, ohne die ich das problem wahrscheinlich nichtmal hätte.

naja ich versuche mal mein glück mit css
 
älter is er, ja, aber nicht von gestern +g
Den Eindruck hat man aber schon. Die Alternative ist, dass Du nicht verstanden hast, was er sagt :-D

er wollte uns das erstmal mit tabellen machen lassen, weil es (wie er sagt) für den anfang einfacher ist, als div (was nächstes halbjahr kommt).
Dieser Satz enthält zweimal Quatsch.
1. Tabellen als Layoutmittel sind alles andere als leicht. Und auch überhaupt nicht intuitiv für Nicht-Freaks.
2. div ist ein einziges von zahlreichen HTML-Tags, das genausowenig Layout macht, wie das Tag table. Wenn er Euch das so erzählt, hat er - sorry - ***zensiert*** keine Ahnung.
Zu seiner Verteidigung kann man nur anbringen, dass er damit bei weitem nicht der einzige ist.

Es ist traurig...die deutschen Schüler sind ja laut Pisa eher unterdurchschnittlich intelligent, aber wenn die Leher nur Mist erzählen, wundert mich das nicht.

*seufz*
-Efchen
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben