# overflow funktioniert nicht



## Lumakrieger (1. November 2009)

Es hat sich erledigt. Danke!


----------



## awortmeier (1. November 2009)

Hallo,
also Overflow:hidden; hat auch auf Text Einfluss.

Zeig doch mal deinen Code, dass man evtl. Fehler finden kann.


----------



## Lumakrieger (1. November 2009)

also um diesen Abschnitt gehts im HTML-Teil:


```
<table width="180" border="0" cellpadding="0" cellspacing="1" bgcolor="#73726e">
<tr><td class="leftmenu_headline" width="180" bgcolor="#c0c0c0">Menu</td></tr><tr><td class="leftmenu_content" width="180" bgcolor="#FFFFFF">dfssdfsfsdfdsfdsfsdfdsfdsfdsfdsfdsfdsfdsfdsfsdfdsfdsffsfsfdsdfdsfs</td></tr>
</table>
```

Und der dazugehörige CSS-Teil sieht wie folgt aus:


```
.leftmenu_headline {
    text-align:left;
    overflow:hidden;
    padding-left: 5px;
    padding-right: 5px;
    font-size:12px;
    text-decoration:none;
    color:#000000;
    font-family:Arial;
}
.leftmenu_content {
    text-align:left;
    overflow:hidden;
    padding: 5px;
    font-size:12px;
    text-decoration:none;
    color:#000000;
    font-family:Arial;
}
```


----------



## Maik (1. November 2009)

Hi,

versuch es nochmal unter Zuhilfenahme von table-layout:fixed.


```
table {
    table-layout: fixed;
    width: 180px;
    background: #73726e;
}
.leftmenu_headline {
    text-align:left;
    overflow:hidden;
    padding-left: 5px;
    padding-right: 5px;
    font-size:12px;
    text-decoration:none;
    color:#000000;
    font-family:Arial;
    width: 180px;
    background: #c0c0c0;
}
.leftmenu_content {
    text-align:left;
    overflow:hidden;
    padding: 5px;
    font-size:12px;
    text-decoration:none;
    color:#000000;
    font-family:Arial;
    width: 180px;
    background: #fff;
}
```

mfg Maik


----------



## Lumakrieger (1. November 2009)

Oh ja, das table-layout macht den Unterschied. Vielen Dank!

Aber wieso? Wieso genügt bei der Tabelle nicht auch bloß ein overflow:hidden?


----------



## Maik (1. November 2009)

In der Voreinstellung (entspricht table-layout:auto) hat der Zelleninhalt Vorrang vor einer Breitenangabe, und da es sich ja um eine Zeichenkette ohne Leerzeichen handelt, die Raum für Zeilenumbrüche bieten würden, wird die Zelle vom Browser in der Breite gestreckt.

mfg Maik


----------



## Lumakrieger (1. November 2009)

mhh, aber irgendwie ergibt sich ein neues Problem.
Irgendwie expandiert die Mitte. Eigentlich sollte die Webseite eine durchgehend gleiche Breite haben. Ich habe sogar Menu und Inhalt vorübergehend komplett rausgenommen und trotzdem bleibt die Mitte größer :-(
Bevor ich dieses Problem mit der Expandierenden Zelle hatte, funktionierte es auch. Es dürfte also nicht an einem mathematischen Fehler liegen.


----------



## Lumakrieger (1. November 2009)

also ich hab nun ein bischen herumgebastelt und nun ist mir klar: das table-layout:fixed verursacht das Problem, dass meine mittlere Tabelle ihre eigentlich vorgegebene Größe dreist ignoriert. Aber ohne dieses table-layout beschneidet er den überlangen Textstring in der Tabellenzelle nicht :-(


----------



## Maik (2. November 2009)

Moin,

so wie's aussieht, mußt du in diesem verschachtelten Tabellendschungel allen drei Tabellen table-layout:fixed mit auf dem Weg geben:

```
<!-- Zeile 42 -->
<table width="798" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;"><tr>
                <td width="190" align="left">

                        <table cellpadding="0" cellspacing="0" class="leftmenu" style="table-layout:fixed;"><tr><td>


<table class="leftmenu_table" cellpadding="0" cellspacing="1" bgcolor="#73726e" style="table-layout:fixed;">
<tr><td class="leftmenu_headline">Menu</td></tr><tr><td class="leftmenu_content">sdfftretesffsfsfrtetdsfdsfdsfsdfsdffdserwrwrfsdfsfsdfsdsdffsfds</td></tr>
</table>

...
```


Aber Tabellen dienen semantisch nicht als Gestaltungswerkzeug einer Webseite, sondern um darin Daten in tabellarischer Form auszugeben.

Warum Layout mit Tabellen dumm ist: Probleme definiert, Lösungen angeboten.

Von daher solltest du dich mal mit einem CSS-Layout näher beschäftigen:


andreas kalt.de: Ein CSS-Layout erstellen
barrierefrei.e-workers.de: Workshop - temp
CSS 4 You - The Finest in Stylesheets: Workshop: Layouten ohne Tabellen
selfHTML: CSS-basierte Layouts
Stichpunkt CSS: Layout ohne Tabellen

mfg Maik


----------



## Lumakrieger (4. November 2009)

Es ist einfach Fakt, dass Tabelle trotzdem einfacher zu benutzen sind als beispielsweise DIVs. Ich sehe in den DIVs keinen größeren Vorteil, vor allem nicht für den Benutzer. Dem Benutzer ist es doch letzten Endes egal, ob im Programmcode ein Table oder ein Div steht, solange die Seite gut aussieht


----------



## Maik (4. November 2009)

Fakt ist, dass dein Markup semantisch nicht wohlgeformt, dafür aber der HTML-Code unnötig aufgebläht ist. 

Dem Benutzer, der beispielsweise sehbehindert  und auf einen Screenreader angewiesen ist, ist es eben nicht egal, wie die Seite ausgezeichnet wurde, Stichwort: Barrierefreiheit.

Desweiteren sind Layout und Inhalt voneinander zu trennen.

Aber dein Wort in Gottes Gehör 

Amen!

mfg Maik


----------

