Tekst geeft verschillende grootte op de iPhone weer

Op een bestaande website wordt één tekstblok te groot weergegeven op een iPhone en een deel ervan is wit. Ik heb het getest op Android en op een iPad, waardoor de rest van de site te ver naar beneden wordt geduwd, zodat hij niet op één lijn staat met de achtergrond. Het is de juiste grootte op een iPad, maar wordt nog steeds wit weergegeven. De tekst in kwestie staat in de rechterbovenhoek op deze pagina: http: //www.ecodzign. com/waterfx2/index2.html Zo ziet het eruit op een iPhone:

enter image description here

Ik heb tekstschalen uitgeschakeld en ik heb geprobeerd inline CSS te gebruiken, zonder effect. Alleen telefoonnummers worden wit weergegeven, dus ik neem aan dat de iPhone een soort koppeling maakt om die nummers met de telefoon te bellen, maar dat kan natuurlijk geen wit met een witte achtergrond zijn.

Mijn excuses voor het vreselijke ontwerp van de tabel en het ontbreken van validatie, maar ik ben simpelweg niet gebudgetteerd om de hele site goed te doen. Er zijn geen validatiefouten die te maken hebben met tekst of opmaak, ik betwijfel of dat iets te maken heeft met wat er aan de hand is.

4
Ik zal proberen het in pixels in plaats van punten te definiëren en toe te voegen! Belangrijk en te rapporteren wanneer ik toegang krijg tot een iPhone
toegevoegd de auteur JDH, de bron
Ik heb het probleem met het witte telefoonnummer ontdekt. De iPhone converteert gedetecteerde telefoonnummers naar links en gebruikt de stijlen die de site voor links heeft, in dit geval om ze wit te maken. De oplossing is om de standaardkleur voor links op dat deel van de site te wijzigen of het telefoonnummer te splitsen met een tag, waardoor de iPhone er geen koppeling van kan maken (I.E. 702. 555 .1212
toegevoegd de auteur JDH, de bron

3 antwoord

Dit kan het verschil zijn tussen zaken als pt versus px versus % op uw iOS-apparaat voor dat specifieke blok.

Na het controleren van je code, denk ik dat dit het in feite is:

font-family: Arial,Helvetica,sans-serif;
font-size: 8pt;
color: black;
font-weight: bold;

De font-size: 8pt Ik durf te wedden is de schuldige.

2
toegevoegd
Je moet gewoon consistent zijn met je CSS, mixen brengt je alleen in de problemen als je crossbrowser/apparaat beschouwt
toegevoegd de auteur Jakub, de bron
Door over te schakelen op pixels is het verschil in grootte hersteld, bedankt!
toegevoegd de auteur JDH, de bron

Er lijkt veel inline CSS op de site te staan.

Wat heb je dit geprobeerd?

702.233.3200

gebruik van het sleutelwoord ! important .

1
toegevoegd

That most likely has to do with the CSS of the website. Your best option would be to create a mobile friendly site or removing from the html that wraps these numbers.

0
toegevoegd