FF/Android kann kein Unicode in CSS?

1 view
Skip to first unread message

Ralph Stahl

unread,
Sep 16, 2022, 7:13:51 AM9/16/22
to

FF 104.2.0 Android

Moin!

Das Folgende ist ein bisschen OT, da es mehrere Themen berührt - neben
Mozilla FF auch noch Android und vor allem HTML/CSS. Ich hoffe trotzdem,
den einen oder anderen Tipp zu bekommen. Als Beispiel sei die Webseite
[1] genannt, dort sind die Pfeile zu sehen (nicht mit Android!).

In dieser responsiven Website möchte ich ein bestimmtes Zeichen - einen
sehr fetten Pfeil nach unten - darstellen, den es als HTML-Entity nicht
gibt, wohl aber als Unicode-Zeichen U+1F847. Ohne einen beim Leser
i.d.R. nicht vorhandenen Zeichensatz kann ich sowas nicht in einer
Zeichenkette darstellen. Aber ich kann mir mit einem CSS-Trick behelfen,
etwas vereinfacht so:

a.button::after {
content: '\1F847';
}

oder

a.button::after {
content: '🡇'; falls das andere Newsreader wiedergeben...
}

a.button ist hier das Element "Download-Button als Link" (kommt aus
Wordpress).

Das funktioniert in alles gängigen Desktop-Browsern, aber eben nicht mit
Android. Leider geht der Trend immer mehr zu Mobilgeräten zum Brausen,
und dort kommt eben nur ein blödes Kästchen statt des Pfeils. Das
beeinträchtigt die Funktion nicht, sieht aber Sch... aus.

Kennt jemand einen Trick außer der Verwendung einer Grafik, die dann auf
kleinen Bildschirmen auch wieder mistig aussieht, weil nur etwa 20x20 px
winzig?

Danke für die Geduld,
Ralph


[1] https://www.gartenverein-wetterschacht.de/downloads/

Marcel Logen

unread,
Sep 16, 2022, 8:37:33 AM9/16/22
to
Ralph Stahl in de.comm.software.mozilla.browser:

>In dieser responsiven Website möchte ich ein bestimmtes Zeichen - einen
>sehr fetten Pfeil nach unten - darstellen, den es als HTML-Entity nicht
>gibt, wohl aber als Unicode-Zeichen U+1F847. Ohne einen beim Leser
>i.d.R. nicht vorhandenen Zeichensatz kann ich sowas nicht in einer
>Zeichenkette darstellen. Aber ich kann mir mit einem CSS-Trick
>behelfen, etwas vereinfacht so:

<https://www.fileformat.info/info/unicode/char/1f847/index.htm>:

| HTML Entity (decimal) &#129095;
| HTML Entity (hex) &#x1f847;

Hilft Dir das evtl. weiter, so daß Du ohne das CSS auskommen
könntest?

Marcel
--
╰────╮ ╭───────╮ ╭─╮ ╭───────────╮ ╭─╮..55..╭────────╮
╭───╯ ╭──╯ ╰───╯ ╰─╮ ..30..╰──────╮ ╭─╯ │ │ ╭─╮ ╰─────╮ ╰──
│ ╭─╮ │ ..22..╰───╮ ╭─╮ ╭────╯ ╰─────╯ ╰─╯ │ ╭───╮ ╰─╮
╰──╯ ╰─╯ ╰─╯ ╰─╯ ..52..╰─╯ ╰────╯

Ralph Stahl

unread,
Sep 16, 2022, 8:52:04 AM9/16/22
to
Am 16.09.22 um 14:37 schrieb Marcel Logen:
> Ralph Stahl in de.comm.software.mozilla.browser:
>
>> In dieser responsiven Website möchte ich ein bestimmtes Zeichen - einen
>> sehr fetten Pfeil nach unten - darstellen, den es als HTML-Entity nicht
>> gibt, wohl aber als Unicode-Zeichen U+1F847. Ohne einen beim Leser
>> i.d.R. nicht vorhandenen Zeichensatz kann ich sowas nicht in einer
>> Zeichenkette darstellen. Aber ich kann mir mit einem CSS-Trick
>> behelfen, etwas vereinfacht so:
>
> <https://www.fileformat.info/info/unicode/char/1f847/index.htm>:
>
> | HTML Entity (decimal) &#129095;
> | HTML Entity (hex) &#x1f847;
>
> Hilft Dir das evtl. weiter, so daß Du ohne das CSS auskommen
> könntest?

Hab ich schon probiert. Man kann in den Button einen beliebigen Text
eintragen wie "runterladen &dArr;" oder so. Dennoch scheitert es bei
Android daran, dass so eine Entity wie oben nicht dargestellt werden kann.
>
> Marcel

Marcel Logen

unread,
Sep 16, 2022, 9:50:08 AM9/16/22
to
Ralph Stahl in de.comm.software.mozilla.browser:

>Am 16.09.22 um 14:37 schrieb Marcel Logen:

>>| HTML Entity (decimal) &#129095;
>>| HTML Entity (hex) &#x1f847;
>>
>>Hilft Dir das evtl. weiter, so daß Du ohne das CSS auskommen
>>könntest?
>
>Hab ich schon probiert. Man kann in den Button einen beliebigen Text
>eintragen wie "runterladen &dArr;" oder so. Dennoch scheitert es bei
>Android daran, dass so eine Entity wie oben nicht dargestellt werden
>kann.

Kämen vielleicht diese Zeichen in Frage?

U+27F1
U+2B07
U+2BC6

<https://www.unicode.org/charts/>

Die haben nicht so große Hex-Werte wie Dein U+1F847 und
werden von Android evtl. doch angezeigt.

Marcel
--
╭─╮ ╭─╮ ╭───╮ ╭─╮ ╭─╮ ╭──╮ ..67..
╯ ╰─╯ ╰───╮ ╭─╯ ╰─╮ │ ╰─╮ │ │ │ ╰─╮ ..67..
╭──────╯ ╭─────╯ ╭────╯ ╭─╯ ╰───╮ ╭──╯ ╰──╮ │ ╭─╯ ╭─╮
╰─────────╯ ╰─────────╯ ╰─╯ ..47..╰───╯ ╰────╯ ╰────╮

Ralph Stahl

unread,
Sep 23, 2022, 7:40:44 AM9/23/22
to
Am 16.09.22 um 15:50 schrieb Marcel Logen:
> Ralph Stahl in de.comm.software.mozilla.browser:
>
>> Am 16.09.22 um 14:37 schrieb Marcel Logen:
>
>>> | HTML Entity (decimal) &#129095;
>>> | HTML Entity (hex) &#x1f847;
>>>
>>> Hilft Dir das evtl. weiter, so daß Du ohne das CSS auskommen
>>> könntest?
>>
>> Hab ich schon probiert. Man kann in den Button einen beliebigen Text
>> eintragen wie "runterladen &dArr;" oder so. Dennoch scheitert es bei
>> Android daran, dass so eine Entity wie oben nicht dargestellt werden
>> kann.
>
> Kämen vielleicht diese Zeichen in Frage?
>
> U+27F1
> U+2B07
> U+2BC6
>
> <https://www.unicode.org/charts/>
>
> Die haben nicht so große Hex-Werte wie Dein U+1F847 und
> werden von Android evtl. doch angezeigt.
>
> Marcel

Probiere ich gleich mal aus, danke!


Ralph Stahl

unread,
Sep 23, 2022, 3:34:05 PM9/23/22
to
Am 16.09.22 um 15:50 schrieb Marcel Logen:
> Ralph Stahl in de.comm.software.mozilla.browser:
>
>> Am 16.09.22 um 14:37 schrieb Marcel Logen:
>
>>> | HTML Entity (decimal) &#129095;
>>> | HTML Entity (hex) &#x1f847;
>>>
>>> Hilft Dir das evtl. weiter, so daß Du ohne das CSS auskommen
>>> könntest?
>>
>> Hab ich schon probiert. Man kann in den Button einen beliebigen Text
>> eintragen wie "runterladen &dArr;" oder so. Dennoch scheitert es bei
>> Android daran, dass so eine Entity wie oben nicht dargestellt werden
>> kann.
>
> Kämen vielleicht diese Zeichen in Frage?
>
> U+27F1
> U+2B07
> U+2BC6
>
> <https://www.unicode.org/charts/>
>
> Die haben nicht so große Hex-Werte wie Dein U+1F847 und
> werden von Android evtl. doch angezeigt.
>
> Marcel

U+2B07 hat funktioniert, die anderen beiden ergeben aufm Händie auch nur
Klötzchen. Übrigens auch mit Chrome etc. Scheint also eher ein
System-Problem zu sein als eins des Browsers. Schlecht.

Danke!
Ralph

Axel Berger

unread,
Sep 23, 2022, 3:48:11 PM9/23/22
to
Ralph Stahl wrote:
> Scheint also eher ein
> System-Problem zu sein als eins des Browsers. Schlecht.

Browser bringen keine eigenen Fonts mit. Damit ein Zeichen angezeigt
werden kann, muß ein Font, der es enthält, irgendwo im System vorhanden
sein.


--
/¯\ No | Dipl.-Ing. F. Axel Berger Tel: +49/ 221/ 7771 8067
\ / HTML | Roald-Amundsen-Straße 2a Fax: +49/ 221/ 7771 8069
 X in | D-50829 Köln-Ossendorf http://berger-odenthal.de
/ \ Mail | -- No unannounced, large, binary attachments, please! --

Ralph Stahl

unread,
Sep 23, 2022, 3:54:28 PM9/23/22
to
Am 23.09.22 um 21:50 schrieb Axel Berger:
> Ralph Stahl wrote:
>> Scheint also eher ein
>> System-Problem zu sein als eins des Browsers. Schlecht.
>
> Browser bringen keine eigenen Fonts mit. Damit ein Zeichen angezeigt
> werden kann, muß ein Font, der es enthält, irgendwo im System vorhanden
> sein.
>
>

Und wie bringe ich einem Androiden einen Font bei, der komplett Unicode
enthält? Naja, ist ja eigentlich Quatsche, ich brauche kein Chinesisch
oder so...

Ralph


Reply all
Reply to author
Forward
0 new messages