WN - Chrome (Android) vägrar lyda CSS. Tips, någon?

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - Chrome (Android) vägrar lyda CSS. Tips, någon? (https://www.wn.se/forum/showthread.php?t=1061843)

Chrome (Android) vägrar lyda CSS. Tips, någon?

Hej!

Mystiskt problem.

Bygger en icke-responsiv sajt. Funkar i alla webbläsare på alla operativ som tänkt. Med ett märkligt undantag:

I Chrome 34.0 på Android 4.3 är det ETT ENDA element som vägrar visa den fontstorlek jag anger. Allt annat lyder snällt.

Jag har testat alla upptänkliga varianter, tex. important, inline style (med och utan important), bytt tag (div, p), flyttat html-koden till 10-15 olika platser på sidan (allt från absoluta toppen till under footern), provat både class och id, ändrat namnet på class och id, tömt cachar, kollat både markup och stilmall noggrannt och kört genom W3:s validator. Inget hjälper.

Det handlar om texten direkt under bildspelet här: http://proformica.com/11an/6/dev.php som börjar "Campus Catering driver två av....". Om jag inte hunnit ändra innan du tittar så är öppningstaggen just nu <p class="egenpres" style="font-size:14px!important;">.

För att se felet bör du alltså kolla i en Android-lur med Android 4.3 och Chrome 34.0. Kanske felet syns i telefoner med liknande bestyckning.

Det är inte hela världen. Både jag och kunden kan leva med det. Det är bara jag som vill få reda på varför, så att jag kan undvika samma problem en annan gång...

Mvh
Danne

Använd remote debugging så ser du vad som försigår.

Nu vet jag ju inte om detta gäller i just ditt fall (mitt dayjob tvingar mig att ha iPhone, så kan inte testa) men vissa mobila webbläsare anpassar texter till storlekar dom de tycker är bättre för att öka läsbarheten. En av de faktorer de kollar på är textlängden i elementet.

Så två texter som har exakt samma stil kan se olika ut i en mobil.

Det kanske har med pixeldensiteten att göra,

Lägg till detta inom <head> taggarna

HTML-kod:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

width=device-width

tar hand om pixeldensiteten här och nu ska inte mobilen behöva zooma konstigt för att försöka anpassa hemsidan.

Hoppas det hjälper

Citat:

Ursprungligen postat av coredev (Inlägg 20492370)

(snip) vissa mobila webbläsare anpassar texter till storlekar dom de tycker är bättre för att öka läsbarheten. En av de faktorer de kollar på är textlängden i elementet.

Misstänkte det och det stämmer nog. Tyvärr blir resultatet idiotiskt i just Chrome. :-(

Citat:

Ursprungligen postat av x264 (Inlägg 20492372)

HTML-kod:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

width=device-width
tar hand om pixeldensiteten här och nu ska inte mobilen behöva zooma konstigt för att försöka anpassa hemsidan.

Funkade! Men genererade några andra dumheter istället. Som ju går att åtgärda....

Egentligen borde man ju skicka ut en responsiv version till småskärmar. Men det handlar om tid och pengar.....

Tack för hjälpen, båda!