Streaming live at 10am (PST)

Form not displaying correctly - Drop Shadow and Blue Border


#1

Hi all

My form is quite displaying correctly. It's showing a drop shadow from the top and the bottom form has an blue border.

It looks fine in Webflow preview - how on my iphone displays the errors.

Screen shots attached.

Any ideas what could be causing this?


Here is my public share link: https://preview.webflow.com/preview/haydenmartisstudio?preview=0abe44189f33913c3a7f74246bc0dc17
(how to access public share link)

src="/uploads/webflow1/original/2X/2/26a84e37330406015a46ff4ac1f9f8be077e26fe.png" width="281" height="500">


#2

I don't have an iPhone on me, so I can't test the drop-shadow issue, but I believe the reason for the blue outline is that you've got autofocus selected on both of those fields. Deselect that and see what happens.


#3

Hi @Hayden_Martis that's usually what happens by default and the Safari mobile browser is adding those extra styles.


#4

ugh - ok thanks good to know


#5

thanks! that fixed the blue banding :slightly_smiling:


#6

You may be able to hijack that by applying your own inner-shadow and just setting the values to zero.


#7

No joy there - but thanks


#8

Hi all - does this make sense to anyone? http://stackoverflow.com/questions/3062968/remove-textarea-inner-shadow-on-mobile-safari-iphone


#9

Hi All - the above code solves the problem. Enter inside you pages custom head tag.

Cheers


#10

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.