Scrollbar waagrecht nicht anzeigen/Tabelle fixieren

unlord · 27. Februar 2004

Meine erste Frage: Wenn man es so schreibt

Code:

style="overflow:scroll"

...wie kann ich es dann schaffen, dass die waagrechte Scrollbar nicht angezeigt wird...

Zweite Frage: Wie kann man eine Tabelle fixieren, dass sie sich nicht mehr erweitert, auch wenn andere erweitert werden!

Hoffe ihr könnt mir helfen

mfg
unlord

Quaese · 27. Februar 2004

Hi,

ob Du den horizontalen Scrollbalken komplett abschalten kannst, weiss ich nicht.
Du kannst jedoch dafür sorgen, dass er nur eingeblendet wird, wenn der Textbereich über den Anzeigebereich hinausragt.

Code:

style="overflow: auto;"

Tabellen fixieren - ich denke, dass Du einfach Höhe und Breite über die Attribute width und height in den jeweiligen Tags (TR, und TD) fest definieren solltest. Damit sollte Deine Tabelle fixiert sein.

Ciao
Quaese

unlord · 28. Februar 2004

mh das mit dem fixieren geht nicht so einfach...

Code:

<html>
<head>
<title>Beat.cs</title>
<meta http-equiv="imagetoolbar" content="no">
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center">
  <table width="1025" height="768" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td colspan="3" rowspan="2" valign="top"><img src="gfx,layout/layout,left,top,logo.JPG" width="281" height="151"></td>
      <td width="521" height="73" valign="top"><img src="gfx,layout/layout,midd,top,logo.JPG" width="521" height="73"></td>
      <td width="222" rowspan="2" valign="top"><img src="gfx,layout/layout,right,top,login.JPG" width="222" height="151"></td>
      <td width="1"></td>
    </tr>
    <tr>
      <td height="78" valign="top"><img src="gfx,layout/layout,midd,under_logo.JPG" width="521" height="78"></td>
      <td></td>
    </tr>
    <tr>
      <td width="152" rowspan="2" height="214" valign="top"><img src="gfx,layout/layout,navi.JPG" width="152" height="214"></td>
      <td height="143" colspan="4" height="143" valign="top"><img src="gfx,layout/layout,content_top.JPG" width="872" height="143"></td>
      <td></td>
    </tr>
    <tr>
      <td width="109" rowspan="4" valign="top" background="gfx,layout/layout,content_left,bg.JPG">&nbsp;</td>
      <td colspan="2" rowspan="5" valign="top" bordercolor="#0D0D0D" background="gfx,layout/layout,content_bg.JPG">
      <p></p>
      <p></p>
      <p></p>
      <p></p>
      <p>&nbsp;<p>&nbsp;<p>&nbsp;<p>&nbsp;<p>&nbsp;<p>&nbsp;<p>&nbsp;</td>
      <td rowspan="2" valign="top" background="gfx,layout/layout,content_right,over_bg.JPG">&nbsp;</td>
      <td height="71"></td>
    </tr>
    <tr>
      <td rowspan="2" valign="top" background="gfx,layout/layout,under_navi,bg.JPG">&nbsp;</td>
      <td height="176"></td>
    </tr>
    <tr>
      <td rowspan="3" valign="top" background="gfx,layout/layout,content_right,bg.JPG">&nbsp;</td>
      <td height="107"></td>
    </tr>
    <tr>
      <td rowspan="3" valign="top"><img src="gfx,layout/layout,navi,bottom.JPG" width="152" height="120"></td>
      <td height="40"></td>
    </tr>
    <tr>
      <td rowspan="2" valign="top"><img src="gfx,layout/layout,content_left,under_bg.JPG" width="109" height="80"></td>
      <td height="28"></td>
    </tr>
    <tr>
      <td height="52" colspan="3" valign="top"><img src="gfx,layout/layout,content,bottom.JPG" width="763" height="52"></td>
      <td></td>
    </tr>
    <tr>
      <td height="1"></td>
      <td></td>
      <td width="20"></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
  </table>
</div>
</body>
</html>

<--- meine site

wenn jetzt nun der kontent bereich (<td colspan="2" rowspan="5" valign="top" bordercolor="#0D0D0D" background="gfx,layout/layout,content_bg.JPG">) zu viel text enthält wird er ja lang gezogen und die anderen tabellen seitlich mit ihm auch... nun will ich aber das diese Tabelle (<td width="152" rowspan="2" height="214" valign="top"><img src="gfx,layout/layout,navi.JPG" width="152" height="214">) gleich bleibt, da sonst ein leerer raum zwischen dieser und der darunterliegenden Tabelle entsteht...

hoffe ihr könnt mir helfen

mfg
unlord

rootssw · 28. Februar 2004

Hallo unlord!

Da ich ja das Design deiner Seite kenne, kenn' ich auch die Problematik, dass der Inhalt nicht einfach so über den Rand hinaus gehen darf (wie sähe dass denn aus?!).
Also, als erstes mal ein Beispiel, wie die Tabelle immer gleich "width" bleibt.

Code:

<table style="table-layout:fixed;">

Das funktioniert NUR im <table>-Tag!

Den wagerechten Scrollbalken kriegst du bei dieser Variante NICHT weg!
Es kommt auch IMMER ein senkrechter, auch dann, wenn der Content garnicht so lang ist, dass du einen brauchst.
Das kriegst du nur weg, indem du statt style="overflow:scroll" mit IFrames arbeitest.

BriXen · 28. Februar 2004

da waeren wir bei meinem Problem. ^^

ich hab auch ne seite gemacht, nen schulprojekt, wo ein iframe drin is.
Wenn jetzt aber der Text in dem Iframe(src) zu lang wird, dann hab ich auhc diesen haesslichen waagerechten scrollbalken.

ich habs mit containern versucht mit css alles will net so richtig klappen.

hier mal der Link

kann mir einer helfen

PS

ups sorry fuer den doppelpost, einer kann gelöscht werden , danke

MfG

unlord · 28. Februar 2004

also wenn du overflow:auto machst, dann werden nur scrollbars angezeigt, wenn man sie benötigt... das heißt wenn der text nicht zu lang in die horizontale gezogen ist, kommt auch der waagrechte Scrollbalken nicht

@rootssw

... das is ein anderes Design ^^

das problem ist ja grade, dass nicht die ganze table gefixet werden soll, sondern nur die eine Zelle...

ich werde die Slices nochmal anders einteilen, vielleicht ergibt es dich dan von automatisch

mfg
unlord

rootssw · 28. Februar 2004

Hallo!

Das mit overflow:auto klappt nicht immer!
Bei Auto entscheidet ja der Browser, wie dieser das Anzeigen möchte.
Und da ist Scroll nur eine (nicht sehr weit verbreitete) Möglichkeit.
Normalerweise kann man davon ausgehen, dass daraus hidden oder show wird!

@Brixen:

Um den Beitrag zu löschen, kannst du auch auf editieren gehen.
Oben ist dann eine Checkbox, die musst du "checken" und dann auf den Button daneben klicken - hast du die Checkbox nicht ausgewählt, wird der Beitrag auch nicht gelöscht.

Und zu deinem Link:
Ich sehe da KEINEN waagerechten Scrollbalken.
Nur einen Senkrechten, aber der ist ja auch richtig, da der Inhalt etwas zu groß ist.

unlord · 28. Februar 2004

ok... ich hab jetzt neue slices gemacht, was mich meinem ziel ziemlich nahe gebracht hat... jetzt frage ich mich nur warum dieser Tolle Tag align="bottom" nicht funktioniert =D

Code:

<head>
<style type="text/css">
<!--
body {
	background-color: #000000;
}
-->
</style>
<meta http-equiv="imagetoolbar" content="no">
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center">
<table border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td height="296" width="1024" colspan="3" valign="top"><img src="layout/layout,top.JPG" width="1024" height="296"></td>
  </tr>
  <tr>
    <td width="276" height="423" valign="top" background="layout/layout,content_left,bg.JPG">
    <img border="0" src="layout/layout,content_left,top.JPG" align="top" width="276" height="59"><img border="0" src="layout/layout,content_left.JPG" align="bottom" width="276" height="423"></td>
    <td width="514" height="423" valign="top" background="layout/layout,content_bg.JPG"><p>
      <p>
    <p></td>
    <td width="234" height="423" valign="top" background="layout/layout,content_right,bg.JPG">
    <img border="0" src="layout/layout,content_right.JPG" align="top" width="234" height="423"></td>
  </tr>
  <tr>
    <td height="49" width="1024" colspan="3" valign="top"><img src="layout/layout,bottom.JPG" width="1024" height="49"></td>
  </tr>
</table>
</div>
</body>

...soo funktioniert alles wunderbar, nur diese Zelle

Code:

    <td width="276" height="423" valign="top" background="layout/layout,content_left,bg.JPG">
    <img border="0" src="layout/layout,content_left,top.JPG" align="top" width="276" height="59"><img border="0" src="layout/layout,content_left.JPG" align="bottom" width="276" height="423"></td>

will noch nicht so ganz wie ich... das Zweite Bild (layout,content_left.JPG) sollte eigentlich am unteren der Zelle sein, wenn jedoch die ganze Zelle erweitert wird und der bg den neuen Platz ausfüllt, schiebt sich der ganze neue bg Teil unter dieses Bild und alles ist buggy -.-... weiß jemand warum align="bottom" nicht richtig funktioniert?

mfg
unlord

unlord · 28. Februar 2004

und hier gleich noch ne Frage: Kann man den scrollbar-track transparent machen Z.B. bei

Code:

body {
scrollbar-face-color: #c0c0c0;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-arrow-color: #E22700;
scrollbar-track-color: #A5A3A4;
}

rootssw · 29. Februar 2004

Das mit der vertikalen Ausrichtung des 2. Bildes sollte so klappen (natürlich im IMG-Tag):

Code:

style="vertical-align:bottom;"

Naja, das mit den Scrollbars farbig machen klappt doch sowieso nur im IE!
Und was verstehst du unter "transparent"?
Ich kenn' keine Farbe, die da heisst "durchsichtig".

Scrollbar waagrecht nicht anzeigen/Tabelle fixieren

unlord

Erfahrenes Mitglied

Quaese

Moderator

unlord

Erfahrenes Mitglied

rootssw

Erfahrenes Mitglied

BriXen

Erfahrenes Mitglied

unlord

Erfahrenes Mitglied

rootssw

Erfahrenes Mitglied

unlord

Erfahrenes Mitglied

unlord

Erfahrenes Mitglied

rootssw

Erfahrenes Mitglied

Neue Beiträge