Closed
Bug 1108903
Opened 10 years ago
Closed 7 years ago
Font size renders wrong in Fennec http://www.satindex.de/update.php
Categories
(Firefox for Android Graveyard :: General, defect)
Tracking
(Not tracked)
RESOLVED
FIXED
People
(Reporter: guigs, Assigned: jillanih)
References
Details
Attachments
(1 file)
(deleted),
text/plain
|
Details |
Description: http://www.satindex.de/update.php compared on desktop and mobile have different font sizes.
There are two different font sizes 9pt and 10px. These may render differently(not in the example TD is not rendered in Desktop):
td.ticker2 {
padding: 2px 4px;
font-size: 10px;
color: #FFF;
font-family: Verdana;
}
TD {
font-size: 9pt;
color: #000;
font-family: Verdana;
}
Expected: CSS to render the same in desktop and mobile.
Comment 1•10 years ago
|
||
Mass change to move Firefox for Android::Readability bugs to block bug 1129033. Filter on readability-mass-move.
Blocks: 1129033
Component: Readability → General
Assignee | ||
Comment 2•7 years ago
|
||
CSS selectors are generally case-insensitive. So you need to use td instead of TD.
td.ticker2 {
padding: 2px 4px;
font-size: 10px;
color: #FFF;
font-family: Verdana;
}
td {
font-size: 9pt;
color: #000;
font-family: Verdana;
}
This will work for mobile and desktop.
Assignee | ||
Comment 3•7 years ago
|
||
Added the updated version of code.
Reporter | ||
Updated•7 years ago
|
Assignee: nobody → jillanih
Assignee | ||
Updated•7 years ago
|
Status: NEW → ASSIGNED
Comment 4•7 years ago
|
||
This appears to be caused by the "Font inflation" feature which increases the text size of certain elements to make them more readable on small screens. This feature is disabled by default in the latest version of Firefox (bug 1127441). You can enabled or disable it by changing Firefox: Settings: Accessibility: "Use system font size".
Status: ASSIGNED → RESOLVED
Closed: 7 years ago
Resolution: --- → FIXED
Comment 5•7 years ago
|
||
And if your web site *does* have a proper (responsive via CSS media queries, or whatever else) mobile layout, you can disable font inflation and mark your page as mobile-friendly by including <meta name="viewport" content="width=device-width"/> (applies to Chrome, too, by the way).
Updated•4 years ago
|
Product: Firefox for Android → Firefox for Android Graveyard
You need to log in
before you can comment on or make changes to this bug.
Description
•