/    Sign up×
Community /Pin to ProfileBookmark

"text-overflow: ellipsis" does not work

Copy linkTweet thisAlerts:
Sep 26.2015

Hi, this is my css-definition:

[CODE]label
{ white-space: nowrap
overflow: hidden
text-overflow: ellipsis }[/CODE]

but if the name of a label at my checkbox is too long, it’s not truncated. Why? You can see here
[URL=”http://nachrichtentisch.de/__fc2.php”]http://nachrichtentisch.de/__fc2.php[/URL]

Look at the third box from the left, third row, label for “Westdeutsche Allg./Westf. Rundschau”

Kind regards and thanx

to post a comment
CSS

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@jedaisoulSep 26.2015 — The only thing I note is that the "label for" comes after the input item it relates to. Every example I've seen has the "label for" preceding the input. It does not follow that it HAS to be that way, but it might be worth testing...
Copy linkTweet thisAlerts:
@pt004authorSep 26.2015 — The only that is changed, is that the label text comes before the checkbox, but that does noch change the truncation-problem...
Copy linkTweet thisAlerts:
@cootheadSep 26.2015 — Hi there pt004,

[indent]

try it like this...

[color=navy]
label{
display:inline-block;
width:90%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}[/color]
[/indent]

[i]coothead[/i]
Copy linkTweet thisAlerts:
@pt004authorSep 27.2015 — Hi, thanks, yes that's better, but the "..."is missing. It just looks this way:


"Westdeutsche Allg./Westf. Runds"

And if I make the browser-window a little bit smaller, the complete label-text goes to the next row at once, while the checkbox stays where it has been...
Copy linkTweet thisAlerts:
@cootheadSep 27.2015 — Hi there pt004,

[indent]

some browsers show the [color=navy]"..."[/color], and some don't. :eek:

You must use [color=navy][i]"@media"[/i][/color] settings to adjust the width of

the label for those different browser-window widths. ?

[/indent]

[i]coothead[/i]
Copy linkTweet thisAlerts:
@pt004authorSep 27.2015 — Hi there pt004,

[indent]

some browsers show the [color=navy]"..."[/color], and some don't. :eek:

You must use [color=navy][i]"@media"[/i][/color] settings to adjust the width of

the label for those different browser-window widths. ?

[/indent]

[i]coothead[/i][/QUOTE]

weird....The firefox at home does not show the ..., the firefox at the office (38.2.1) does....
×

Success!

Help @pt004 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...