I'm building a form using Hubspots native form builder and want the placeholder text within each field to be center aligned. This works fine for all the text input fields, but doesn't work on the Select drop down when viewing on IOS mobile devices (tested on Safari, Chrome and Edge for IOS). It appears to work fine on Android.
I've tried various CSS methods including
text-align:center
input, option, select[id="idstring]::placeholder, ::placeholder, ::-webkit-input-placeholder, :-ms-input-placeholder, input::-moz-placeholder and a few more.
Completely at a loss on how to get it center aligned"
Can you try your use case via Safari Technology Preview and if it is not fixed, can you raise it on bugs.webkit.org?
Attaching standalone testcase to reproduce this on WebKit bugzilla would be great help.
Related
Iam displaying a form inside the bootstrap modal dialog. But, the elements disappears/flickers when scrolling the form keeping keypad open in windows phone 8. This issue is not observed in any other browsers. e.g. firefox, iOS, mac etc... It would be great if someone helps me to fix this...
Some time cross browsers effects some tags and scripts, may be you are using a kind of browser where html5 is not supported for html5 support even in IE you can use HTML5.JS here is the LINK For reference see this Link
im new to polymer just want to know why it looks different from chrome and fox?
chrome looks good but in fox it looks different like the color of the scaffold toolbar, logo and content, im using firefox 33.1
url: http://jigs-gfx.net/polymer/practice/
Firefox doesn't seem to be honoring your use of the deep shadow elements in your site.css file.
header-koh::shadow .logo{
Is valid in chrome, but not in Firefox. Firefox doesn't fully support web components and all their conventions out of the box, but you can enable the dom.webcomponents.enabled flag to turn them on and get a similar experience across browsers. A guide to how to enable the feature is given here:
Enable Custom Elements in Firefox
Firefox and IE both have full web component support in progress and hopefully will support them out of the box soon.
NOTE: If you follow the steps below on IE11 (haven't tried other IE versions) it may crash your browser. So be prepared for that.
Open up my sample at http://jsfiddle.net/b8JZq/2/
I have a simple setup with a textarea hidden by default (via css style) and a button that shows the textarea.
Click on the button to show the text area.
In the textarea, enter only new line characters.
Click outside the textarea.
This consistently causes my IE11 to crash. Works fine on Chrome, Safari, FF versions I have tried.
Entering any other text apart from new lines only does not cause the issue. Problem also does not happen if the textarea was visible to begin with. Is there a workaround to this?
Now this is a known bug for the IE team: http://connect.microsoft.com/IE/feedback/details/808986/ie-11-entering-value-with-newline-in-textarea-crashes-browser
Today i upgrade my phone to iOS7 and find out some weird problem .
(blog.niwyclin.org)
This is a test post page of my web site
On desktop browser it looks fine.
I use Responsivator to check, and its perfect, like this (i.minus.com/ipy6XHEepJcvf.png)
but on browser in iOS7 (include safari and chrome)
(i.minus.com/i2B2Ul5f09WL8.png)
(i.minus.com/iDM5uVFIvegKe.png)
it break a word but i don't know why.
It has white-space: pre set.
Any issues with the my css(less) code?
I found out the solution.
From http://www.mobilexweb.com/blog/safari-ios7-html5-problems-apis-review
it seems webkit on iOS 7 changes overflow-wrap property.
so i add pre {overflow-wrap: normal;} manuale, and it's done.
see http://demo.tutorialzine.com/2009/09/fancy-contact-form/demo.php
it is same contact form that i integrated in my website. it works perfect except input text boxes WIDTH. how could make it same as looks in Mozilla Firefox. Any idea, suggestion for it.
Thanks
In your example, the styles are set differently in both browsers (different inline style and class attribute values)