fok.nl - Text cut off at NIEUWS part of http://frontpage.fok.nl/

RESOLVED FIXED

Status

Tech Evangelism Graveyard
Dutch
RESOLVED FIXED
7 years ago
3 years ago

People

(Reporter: Tom Levels, Unassigned)

Tracking

({testcase})

Details

(URL)

Attachments

(2 attachments)

(Reporter)

Description

7 years ago
Created attachment 544228 [details]
Screenshot of problem

User Agent: Mozilla/5.0 (Windows NT 5.1; rv:8.0a1) Gecko/20110706 Firefox/8.0a1
Build ID: 20110706030833

Steps to reproduce:

Go to http://frontpage.fok.nl/


Actual results:

Look at the "NIEUWS" part on the left part of the frontpage of the site. The times/dates of the different topics are cut off.


Expected results:

The times/dates should be displayed correctly like in IE or older versions of FF.
Created attachment 544239 [details]
Testcase #1

Distilled markup / styles from the URL.
Firefox (7 and newer) implements text-overflow markers on both sides of the
block per http://dev.w3.org/csswg/css3-ui/#text-overflow
(other browsers don't do this, yet)

The ellipsis on the left side is triggered by this rule:

span.trackerTime {
	color: #909090!important;
	font-family: arial!important;
	font-size: 9px!important;
	padding-left: 1px!important;
	margin-right: -4px!important;
	margin-left: -1px!important;
}

in http://i.fokzine.net/fp/fp2009/s/fp2009.css?20110624.css

If you don't want the ellipsis on the left side you should remove the
"margin-left: -1px" as that creates overflow that triggers a text-overflow
marker.
Assignee: nobody → dutch
Blocks: 312156
Component: General → Dutch
Keywords: testcase
OS: Other → All
Product: Firefox → Tech Evangelism
QA Contact: general → dutch
Summary: Text cut off at NIEUWS part of http://frontpage.fok.nl/ → fok.nl - Text cut off at NIEUWS part of http://frontpage.fok.nl/
Version: 8 Branch → unspecified
(Reporter)

Comment 3

7 years ago
So this behaviour is according to the specs and the site should adjust their css?
Yes.  Please contact them if you now the language and can find any contact info
for the site.  Give them the URL to this bug report.  Thanks.
(Reporter)

Comment 5

7 years ago
I contacted the site and they already changed the css, but is still does not work:
span.trackerTime {
	color: #909090!important;
	font-family: arial!important;
	font-size: 9px!important;
	padding-left: 1px!important;
	margin-right: -4px!important;
	position:relative!important;
    left:-1px!important;
}
Thanks for contacting them, it's good news that they are trying to fix
the issue.  The new CSS rule has the same problem as the original -
"position:relative; left:-1px;" also creates overflow.  They should just
remove that, and remove the "padding-left: 1px" in the same rule if they
want the text to start at the edge.  That is:

span.trackerTime {
	color: #909090!important;
	font-family: arial!important;
	font-size: 9px!important;
	margin-right: -4px!important;
}
(Reporter)

Comment 7

7 years ago
The site is fixed now, I will set the status as Resolved Invalid.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 7 years ago
Resolution: --- → INVALID

Comment 8

7 years ago
Since this was a site problem and the bug lives in TE, FIXED.
Resolution: INVALID → FIXED
Product: Tech Evangelism → Tech Evangelism Graveyard
You need to log in before you can comment on or make changes to this bug.