[HTML/CSS] TD-nowrap werkt alleen als width = "" of in % - Softwareontwikkeling

donderdag 23 september 2004 10:32

Acties:

Topicstarter

Op een HTML-pagina staat een table met 'table-layout': fixed. Ook de tablecells moeten d.m.v. een width in pixels ingesteld worden. Echter de cells mogen maar uit één regel bestaan, dus moet ik werken met 'nowrap' in de <td> of als style 'white-space: nowrap;' instellen.

De nowrap functioneert echter alleen goed als de td-width niet of in percentage is ingesteld. De width moet echter ingesteld worden in Px.

Hoe dit voor elkaar te krijgen?

donderdag 23 september 2004 10:33

Acties:

André

Analytics dude

Niet.

Je wilt dat lange regels niet af mogen breken en toch mogen ze niet langer zijn dan een aantal pixels. Het enige wat je dan kunt doen is een overflow-x: hidden op de TD zetten.

donderdag 23 september 2004 10:37

Acties:

EmilneM

Topicstarter

André schreef op 23 september 2004 @ 10:33:
Niet.

Je wilt dat lange regels niet af mogen breken en toch mogen ze niet langer zijn dan een aantal pixels. Het enige wat je dan kunt doen is een overflow-x: hidden op de TD zetten.

Klopt....ik laat de regel netjes afbreken met '...' door de CSS-property 'text-overflow: ellipsis;'.

'Overflow-x: hidden;' geeft geen resultaat op de TD..... De nowrap wordt nog steeds genegeerd.

donderdag 23 september 2004 10:38

Acties:

André

Analytics dude

Als jij regels laat afbreken met ellipsis dan ben je nowrap toch niet nodig?

donderdag 23 september 2004 10:39

Acties:

EmilneM

Topicstarter

André schreef op 23 september 2004 @ 10:38:
Als jij regels laat afbreken met ellipsis dan ben je nowrap toch niet nodig?

Toch wordt met ellipsis een harde enter gegeven bij een whitespace...

Als de text in de cell geen spatie bevat gaat alles goed.

donderdag 23 september 2004 10:42

Acties:

André

Analytics dude

En als je de height van de cell vastzet dan? Dan is er geen ruimte om af te breken en zal hij die puntjes direct op de eerste regel neerzetten.

donderdag 23 september 2004 10:47

Acties:

EmilneM

Topicstarter

André schreef op 23 september 2004 @ 10:42:
En als je de height van de cell vastzet dan? Dan is er geen ruimte om af te breken en zal hij die puntjes direct op de eerste regel neerzetten.

Dat is het vreemde, height en overflow-x staan ingesteld........toch breekt hij nog af.

donderdag 23 september 2004 11:03

Acties:

McVirusS

Misschien een URL zodat we kunnen kijken wat je nu hebt?

donderdag 23 september 2004 11:03

Acties:

crisp

Devver

Pixelated

welke browser gebruik je eigenlijk; er zijn nog maar weinig browsers die de CSS3 text-overflow geimplementeerd hebben...

Intentionally left blank

donderdag 23 september 2004 11:10

Acties:

EmilneM

Topicstarter

crisp schreef op 23 september 2004 @ 11:03:
welke browser gebruik je eigenlijk; er zijn nog maar weinig browsers die de CSS3 text-overflow geimplementeerd hebben...

IE6

donderdag 23 september 2004 11:33

Acties:

EmilneM

Topicstarter

McVirusS schreef op 23 september 2004 @ 11:03:
Misschien een URL zodat we kunnen kijken wat je nu hebt?

Heb even geen webspace.....hier wel een stukje code ter voorbeeld. Kan rechtstreeks in HTML worden geplakt voor weergave:

HTML:

<html>
    <head>
        <style>
            .Table {
                table-layout:fixed;
                
            }

            .Table TD {
                overflow-x: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
                border: 1px solid black;
                height: 60px;
            }
        </style>
    </head>
    <body>
        <table class="Table" width="400px">
            <tr>
                <td width="200px">
                    Dit is een testregel met width ingesteld in px
                </td>
                <td width="50%">
                    Dit is een testregel met width ingesteld in percentage  
                </td>
            </tr>
        </table>
        
    </body>
</html>

donderdag 23 september 2004 11:35

Acties:

Genoil

ik heb dit probleem opgelost met een extra divje in de cel:
http://www.meneer.net/test/tabel3.html

donderdag 23 september 2004 11:39

Acties:

EmilneM

Topicstarter

Genoil schreef op 23 september 2004 @ 11:35:
ik heb dit probleem opgelost met een extra divje in de cel:
http://www.meneer.net/test/tabel3.html

Probleem is eigenlijk dat het ASP.NET output van een datagrid webcontrol is........heb dus geen controle over extra divje in de cell.

Als het kan moet het dus in de stylesheet of rechtstreeks in <td> opgelost worden.

[ Voor 12% gewijzigd door EmilneM op 23-09-2004 11:40 ]

donderdag 23 september 2004 14:08

Acties:

crisp

Devver

Pixelated

EmilneM schreef op 23 september 2004 @ 11:10:
[...]

IE6

vergeet het dan maar; IE heeft nog niet eens CSS2 volledig en foutloos geimplementeerd, laat staan text-overflow... (ook FF 0.9.3 en Opera 7.6 ondersteunen het nog niet)
overflow:hidden is dus de enige manier...

[ Voor 18% gewijzigd door crisp op 23-09-2004 14:10 ]

Intentionally left blank

Pagina: 1

Reageer