Kendo Grid reading link tags in IE 11 - kendo-grid

I'm having an issue where if a cell contains a link to something, it reads the cell as "out of table" instead of saying that its a link and whatever text it is. Is there a workaround for this for IE11? It seems to work fine in Chrome. I'm using JAWS as well as the screen reader.

Related

Formatting bug when printing web page

I am attempting to print a web page via Ctrl-P or right-click print so I can save it as a PDF. Up until several minutes ago, this was working flawlessly. I have made some minor sizing edits to the grid I am working with on the page and now when I attempt to print, the web page is displaying some formatting glitches on the preview screen.
The problem is shown below. There are various borders missing from the grid and this is carrying over to the PDF when fully saved. Nothing is missing when viewing the page normally.
I am aware this is a silly question, but for the sake documenting it, I did find out my issue.
My textareas are currently overlapping borders in certain areas of my grid. This appears to cause those grid borders to disappear to show the full textarea.
Below I took a snapshot to show how the textarea's blue line is going over my grid.
Solution: add padding to a bordered <div> if a textarea is in it

Content disappears or appears randomly Chrome

Strange bug I fixed once in the past but did not write it down/document it/report it so now I'm lost in the same workframe.
So, it's an Angular 2 app, the content is hardcoded html, no Angular binded variables, data banding or similar.
The bug show up on Chrome, not on Firefox.
If I refresh 10 times in a row, the content will show up sometimes and won't others, there is no pattern or clues about it.
Once the content is hidden, if i change whatever element property, will show up all the content instantly.
I have attached a gif which explains the bug clearly.
Thanks for any idea/suggestion/help :)
EDIT 1:
I just added 2 pictures of the css computed, one with Bootstrap 4 and other without the framework, same result.
Not related at all to Angular or any stuff like that.
I am importing a font from the GoogleFonts page. If I download this font, I get TTF format, which is having a bug on Chrome and does not work properly, but if I link to their server, it's using WOFF2 format.
See this picture attached which it shows the different formats for the same font.

Disabled Input Field on Responsive Mode in Chrome

I have a form with Seven fields designed with Yii2. They validation and the input works well on all browsers but the moment i switch to responsive mode using the Developer Tools, Four of those fields stops working (it becomes disabled). It happens majorly on Google Chrome and Internet Explorer. I have tried all i can to resolve this but not hitting a head way. Please guide me on how to resolve this.
An image showing the list of fields is attached
After i tried all possible ways, i first commented out the whole css that was attached and immediately it started working. So i started adding the css one after the other and boom!!! the judas showed up and that was how i discovered that it was just a line of that css that was the cause.
Found float:left as one of the properties of the input['type=text']. I removed it and works fine now.

Google Chrome Print Preview of page issue

I have a problem that I am trying to fix for someone on the below page.
http://www.photographix.co.uk/external/the_dolphin/a-la-carte-menu.php
The problem is that when I attempt to print the page it is on one page only and half of the text disappears. This is on google chrome only (other browsers appear to be working ok which surprises me).
I am using a print style sheet and have tried using page breaks to no avail.
This is how they are printing to each browser, I appreciate each one may be slightly different.
(Need more rep to post all links)
http://www.photographix.co.uk/external/the_dolphin/chrome.pdf
At the moment I am just trying to get the text on chrome to appear on more than one page, I appreciate any help given.

'Block Style' radio buttons working on everything BUT iPad

I have a group of radio buttons, and have styled them so that they display:block so that they appear like buttons (have also hidden the radio button itself). This works great in Chrome and Firefox on desktops and on android tablets...but will not work on an iPad.
See it here:
http://jsfiddle.net/WhNRK/
For whatever reason the block element is not 'active' on an iPad and does not set the radio button. If I 'unhide' the radio button you can see that it doesn't get select when clicking the block. However if I click the actual radio button itself, it selects properly and even changes the block element background color as it should!
http://jsfiddle.net/WhNRK/1/
Any idea as to what I'm doing wrong that is causing this to happen? Seems like it should be pretty straightforward functionality, so I'm hoping its just something simple I'm overlooking...
The primary use of the site that this is incorporated within is meant for mobile devices, so definitely need it working on any iOS device (assuming it likely happens on an iPhone as well, just don't have one here with me to test right now).
Thanks for any suggestions you may have!
Fisrt of all, your fiddle does indeed not work on the iphone either, both in safari and chrome.
Curious as i am, i tried to find the solution by playing a bit with your code. In changed the html a bit to make the label a sibling of the input, rather then a parent. Still with no effect on my iphone.
After some googling i found this: http://forums.macrumors.com/showthread.php?t=785632
I tryed the solution and it seems to work, allthough i have no clue why. I guess it is some sort of bug...
You have to add onclick="" to your labels.
I didn't test it on an iPad, but as it is just a big iPhone it should work the same. A working example can be found here: http://jsfiddle.net/WhNRK/15/