verschil weergave in firefox en safari

[rob1970]

Hier staat een website.

De tekst in de blokken zou overal vrijwel even veel moeten zijn, zodat alle blokken dezelfde hoogte hebben. In Firefox is dit ook het geval.

Maar in safari is de tekst in 2 blokken niet gelijk ten opzichte van die in firefox.
Links in de screenshots is firefox.

De tekst in het blok van Samana is te lang.

De tekst in het blok van Citi Developers is te kort.

Nu kan ik bijvoorbeeld een paar woorden toevoegen aan de tekst van Citi Developers om het in Safari passend te maken. Maar dan wordt deze in Firefox weer te lang zodat dat blok te hoog wordt.

Is hier iets op te verzinnen?

 

[rob1970]

Was vergeten de link te vermelden. Het gaat om deze pagina: https://met-rob.com/test/ontwikkelaars.html

 

[bron]

Het is een mooie template maar gemaakt met het oudere Bootstrap 3. Kolommen worden hierin met float: left naast/onder elkaar gezet. Je hebt met float weinig (ik denk geen) mogelijkheden om dit op te lossen zonder de template flink aan te passen.

In recentere versies van Bootstrap wordt flex gebruikt waarmee kolommen in een rij met
align-items: stretch even hoog kunnen worden gemaakt.
Dit kan niet in deze template ertussen worden gezet, dat werkt niet.

 

[rob1970]

Ok. Dan laten we het zo. Is ook geen ramp. Tx

 

[rob1970]

Heb het trouwens op een andere manier opgelost en nu is het ook goed. Het verschil zat er met name in lange woorden die bij de ene browser nét afgebroken werden en bij de andere niet. Met het aanpassen van enkele woorden is het nu in beide browsers hetzelfde.

 

[bron]

Op laptop is het bij mij in FF goed maar niet in Chrome of Edge.

Het wordt Trial-and-Error om de teksten er cross-browser in te zetten

Firefox gebruikt voor de pagina opbouw (renderen) de Geeko engin. De bekende andere browsers zoals Chrome, Brave, Edge, Opera en Samsung-browser gebruiken de Blink engin. Dus FF kan er iets anders uitzien. Het is handiger als de website wordt geoptimaliseerd voor de Blink browsers.