Scroll-Table Problem + Designbewertung

[tomtom]

Hi Leute!

Hab die Suche schon strapaziert, leider aber nichts brauchbares zu meinem Problem gefunden.

Ich hab folgendes Problem:
Ich habe auf meiner Homepage im Newsbereich ein DIV dass sich an einer bestimmten Stelle befindet. In diesem DIV liegt eine Tabelle deren TD Tag mit der CSS Klasse "news" ausgestattet ist. Diese Klasse beschreibt lediglich die Farben für die Scrollbalken. Denn in der Spalte liegt noch ein DIV mit der Klassenbezeichnung "scroll". Dieses ist so konzipiert, dass wenn der Text in der Spalte (also in der Tabelle) länger ist als die Tabelle hoch, eine Scrollleiste erscheint.
Das funktioniert ja auch ganz gut. Allerdings hab ich einen negativen Nebeneffekt bei der Scrollleiste: Es erscheint nicht nur eine senkrechte, sondern auch eine waagrechte Leiste, welche deshalb erscheint weil die senkrechte Scrollbar Platz von meiner Tabelle einnimmt - somit ist die Tabelle im DIV größer - eine Scrollbar für die waagrechte muss her...und das sieht eben nicht gut aus...wie kann ich das beheben???

Hier die nötigen Klassen aus dem Stylesheet:
DIV.news {position: absolute; top: 176px; left: 502px; width: 373px; text-align: left;}
DIV.scroll {width: 100%; height: 100%; overflow: auto;}
TD.news
{
width: 371px;
height: 500px;
border-collapse: collapse;
border: 1px solid #B8B8B8;
font-family: verdana;
font-size: 10px;
color: #434343;
background-color: #FFFFFF;
scrollbar-base-color: #D1E0EE;
scrollbar-3d-light-color: #FFFFFF;
scrollbar-arrow-color: #D1E0EE;
scrollbar-darkshadow-color: #D1E0EE;
scrollbar-face-color: #FFFFFF;
scrollbar-<BR>highlight-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;
}


Die Baumstruktir sieht also so aus: DIV.news --> TD.news --> DIV.scroll

Ich weiß es ist nicht gut erklärt (hab auch keinen Plan wie ich das besser erklärn sollte^^), deshalb hier der Link zur Page (Ne Designbewertung am Rande wär auch nicht schlecht^^)

http://www.w3fx.de/preversion/index.php

Hier seht ihr dann gleich was mein Prob is.... (Newsflash anschauen)

Vielen Dank!!
MFG, terminator2k3

[Schiller]

Also ich sehe da keinen horizontalen Scrollbalken. :| (FireFox)

[tomtom]

Thx2Schiller: Firefox und auch Opera(habs grad getestet) lassen den Balken weg. Allerdings nicht der IE (Seite ist jedoch HTML Strict)!!!

[Digger]

Also ich sehe da keinen horizontalen Scrollbalken. :| (FireFox)Du meinst vertikal, gell?! ;)
Ich habe auch keinen hier mit IE 5.5. Schau später nochmal zuhause, da habe ich alle Browser.

Ansonsten sollte overflow: y-auto;
overflow: x-auto;
im css helfen.

Edit: Hast Du dem Body noch nicht zugewiesen.

[tomtom]

Ansonsten sollte overflow: y-auto;
overflow: x-auto;
im css helfen.[/QUOTE]

Hilft leider nur insofern, dass sich meine Tabelle so vergrößert, dass ALLE Scrollbalken wegfallen :(
Meine Tabelle sollte aber eine fixe Größe beibehalten und nur vertikal scrollbar sein ;)

MFG

[Schiller]

Du meinst vertikal, gell?! ;)


Hä? Horizontal ist doch waagerecht!? Also von links nach rechts. Und vertikal ist doch von oben nach unten(senkrecht)!? :|

Bei mir ist der von links nach rechts nicht da, sondern der von oben nach unten.

[tomtom]

Edit: Hast Du dem Body noch nicht zugewiesen.

Hmm...haut leider auch noch nicht hin :(

MFG

[myriell]

Also im Mozilla ist sie ja wie gesagt nicht, im IE 6 jedoch schon.
Mit overflow-x:hidden (oder war's y?) müsstest du sie unterdrücken können.
Oder du weißt der Tabelle oder dem Div eine Breite zu, bei der eben keine Scrollbar entsteht.

[Digger]

Hä? Horizontal ist doch waagerecht!? Also von links nach rechts. Und vertikal ist doch von oben nach unten(senkrecht)!? :|

Bei mir ist der von links nach rechts nicht da, sondern der von oben nach unten.Vergiß mein Posting einfach wieder... ich hatte anscheinend dicke Augen oder gerade etwas Luft im Hirn, als ich das geschrieben hab! :wink:

[Digger]

@terminator
Fällt mir gerade auf. Nimm mal das BR hier raus:scrollbar-<BR>highlight-color: #FFFFFF;

[tomtom]

Ups..stimmt...was sucht das hier...^^ :confused:

[Kinman]

mach die table so das kein horizontaler blanken kommt, weil früher der später wird immer einer da sein, wenn du genug news hast.

Oder zeig immer nur soviel an, das kein blaken kommt und mach in den news-flash einen link zu allen news, und dort das design so das es sich ausgeht.

mfg Kinman

[tomtom]

Hmm...wäre eine Idee...werds in nächster Zeit mal probieren ;)

[Gast]

Hi,

dein Problem liegt bei einem Problem vom IE. Der skaliert bei 100% (nur in der Breite) nicht richtig.
Deine einzelnen News sind in einer Tabelle verpackt:
<TABLE CELLPADDING="0" CELLSPACING="0" WIDTH="100%" BORDER="0">

Hier musst du die width z.b. auf 99% setzen, auf jeden fall aber kleiner als 100%. Sonst bekommst du den horizontalen Scrollbalken. Ist, wie schon gesagt, ein Bug im IE.

Mal ne andere Frage: wieso schreibst du alle Tags groß? Wieso verwendest du ein gefrikel mit Tabellen in Tabellenzellen in Tabellen? Wie wärs mit einer sauberen, auf CSS basierenden Struktur: <div id="maindiv"><div>ÜBERSCHRIFT</div><div>TEXT</div></div>, und dem Text-div dann noch ein margin-bottom von z.B. 5 px zuweisen. Sieht dann schon viel besser aus, und du hast keine Probleme mit den horizontalen Scrollbalken (weil: ein div ist immer so breit wie das Elternelement wo es reinkommt, falls nichts anderes angegeben ist).
Außerdem würde ich in der ersten Zeile den Doctype reinschreiben (nicht leerlassen) und den Kommentar vor <html> in den Header rein. Dann wird auch die Struktur einigermaßen gewahrt.

Gruß, Arno Nym

[Kinman]

Ich schreibe auch alle Tags groß...bringt meiner Meinung nach mehr Übersicht.

mfg Kinman

[Gast]

Hi,

spätestens bei XML, bzw. XHTML (womit ich jede neue Seite erstellen würde) ist Kleinschreibung Pflicht.

Gruß, Arno Nym

[Konne]

Vorteile von XHTML ? Noch nie gesehen oder gehört ^.^

[Sphinx]

Vorteile von XHTML ? Noch nie gesehen oder gehört ^.^

Vorteile strikte (xHTML 1.1) Trennung von Inhalt und Eigenschaften...

[tomtom]

Naja ich schreib die tags auch wegen der Übersicht groß...Mit xHTML hab ich noch nix gemacht, ich werde eure tipps aber befolgen ;)

[snowguard]

Mal zum Design:

Om Aufbau usw find ich die Seite recht schön und gut gemacht.
Das was mich stört sind die doch sehr kontrastarmen Farben...
Wäre besser wenn du mehr Kontraste verwenden würdest. So wirkt die Seite zu blass.

[tomtom]

Kann durchaus sein dass der Kontrast etwas schwach wirkt. Das liegt eventuell daran, dass ich das Design am Notebook also mittels TFT gemacht habe. Werde den Kontrast etwas erhöhen! Vielen Dank für die Info ;)

MFG

[tomtom]

So, hab den Kontrast aller Grafiken im Design um 25% erhöht. Bitte sagt mir ob dass jetzt so passt, oder ob ich den Kontrast noch weiter erhöhen soll.

Des Weiteren wurde die Usermenüleiste neu gestaltet. Ihr könnt den Menüpunkt registrieren schon anklicken, die Registrierungs selbst funktioniert aber noch nicht ;)

Hier noch mal die alte Version:
http://www.w3fx.de/preversion/index.php

Und hier die NEUE Version:
http://www.w3fx.de/preversion2/index.php

[Gast]

nee, gerade das macht die seite aus. sie wirkt dadurch sehr rein und elegant.

[tomtom]

ok, dann lass ich den Kontrast derweil mal so....was sagen die anderen?

MFG