Hypertext Markup Language (HTML) is the standard markup language for documents designed to be displayed in a web browser.

Posts under HTML tag

23 Posts

Post

Replies

Boosts

Views

Activity

How to prevent text wrapping in iOS browser's default option tag?
In the Safari browser on mobile devices, the tags in an HTML element are styled with the system's default styles. I want the text inside the tags to be displayed without line breaks. However, in reality, the text wraps according to its length. May I ask if there are any methods to achieve this? (ps: CSS-related properties such as white-space: nowrap do not work.)
0
0
384
Feb ’25
HTMLAudioElement on iOS is paused when video plays again
On iOS (iPhone or iPad) the following behaviour happens: when both an HTML video element and an HTML audio element are playing on a page, and the video source ends, and the video source is programmatically forced to play again then the system will automatically pause the audio. See following stackblitz project for a sample: https://stackblitz.com/edit/ios-audio-paused-on-video-playing?file=README.md Steps to reproduce Feel free to try with both another audio and video source, here limited by the available space in Stackblitz plan. On an iPhone/iPad device or simulator, in Safari: browse to index.html when on iPhone, press iPhone Load to force preloading video. Not needed on iPad press Play to start playing both audio and video wait until clip ends and then restarts from 0:00 Expected Audio should keep on playing and eventually loop. Actual When clip restarts from 0, audio is put to pause by the system. Further details This does not happen e.g. on Mac Safari nor on another device/browser. Also, some alternative scenarios: when HTML video element has the muted attribute, the issue disappears and audio is not paused when HTML audio element is replace with Web Audio API, the issue disappears and audio is not paused
Topic: Safari & Web SubTopic: General Tags:
0
0
337
Jan ’25
Bidirectional Text Rendering Issue in Swift UILabel for Arabic
I'm encountering an issue displaying a large HTML string (over 11470 characters) in a UILabel. Specifically, the Arabic text within the string is rendering left-to-right instead of the correct right-to-left direction. I've provided a truncated version of the HTML string and the relevant code snippet below. I've tried setting the UILabel's text alignment to right, but this didn't resolve the issue. Could you please advise on how to resolve this bidirectional text rendering problem? The results of the correct and incorrect approaches are shown in the image below. Here's the relevant Swift code: let labelView: UILabel = { let label = UILabel() label.textAlignment = .right label.translatesAutoresizingMaskIntoConstraints = false label.numberOfLines = 0 label.semanticContentAttribute = .forceRightToLeft label.backgroundColor = .white label.lineBreakMode = .byWordWrapping return label }() //Important!! //It must exceed 11470 characters. let htmlString = """ <p style=\"text-align: center;\"><strong>İSTİÂZE</strong></p> <p>Nahl sûresindeki:</p> <p dir="rtl" lang="ar"> فَاِذَا قَرَاْتَ الْقُرْاٰنَ فَاسْتَعِذْ بِاللّٰهِ مِنَ الشَّيْطَانِ الرَّج۪يمِ </p> <p><strong>“</strong><strong>Kur’an okuyacağın zaman kovulmuş şeytandan hemen Allah’a sığın!</strong><strong>”</strong> (Nahl 16/98) emri gereğince Kur’ân-ı Kerîm okumaya başlarken:</p> <p dir="rtl" lang="ar">اَعُوذُ بِاللّٰهِ مِنَ الشَّيْطَانِ الرَّج۪يمِ</p> <p><em>“Kovulmuş şeytandan Allah’a sığınırım” </em>deriz. Bu sözü söylemeye “istiâze<em>” denilir. “Eûzü”</em>, sığınırım, emân dilerim, yardım taleb ederim, gibi anlamlara gelir. It must exceed 11470 characters.</p> “”” if let data = htmlString.data(using: .utf8) { let options: [NSAttributedString.DocumentReadingOptionKey: Any] = [ .documentType: NSAttributedString.DocumentType.html, .characterEncoding: String.Encoding.utf8.rawValue ] do { let attributedString = try NSAttributedString(data: data, options: options, documentAttributes: nil) labelView.attributedText = attributedString } catch { print("HTML string işlenirken hata oluştu: \(error)") } } I'm using iOS 18.2 and Swift 6. Any suggestions on how to correct the bidirectional text rendering?
0
0
382
Jan ’25