Streaming live at 10am (PST)

Bottom borders not rounded on mobile

Hi,

So I have a site where I used border bottom to create some rounded divider lines but I noticed on my iPhone the borders are not being rendered square instead of round. Anyone know what causes this and whether it can be fixed?

On desktop:
00%20PM

On Mobile:
53%20PM

Thanks,
Ben

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi Benni,

Can you share a read-only link?

The website is: everbaby.me

Hi @bbmettler,

A share link will help us review your project and provide better answers for you. You can find out how to provide a share link here: https://www.loom.com/share/8c7cf88cdb134278bfc3660cebd96260

TIA, Brandon

1 Like

Here you go:

https://preview.webflow.com/preview/everbaby?utm_medium=preview_link&utm_source=dashboard&utm_content=everbaby&preview=2083cdd3e0ffabac1ff8f5ee651925f9&mode=preview

I think that the iPhone engine is rendering a dotted border this way…


This article mentions browsers and not OS, nevertheless, I believe that is the issue.

Solution- Use SVG? could be also inline SVG
http://jsfiddle.net/eliranmal/hsfxS/

1 Like

Cool that should work. Thanks for your help!

1 Like