Addressing the issue of compatibility with iPhone 5 and 5S in both portrait and landscape modes

I made an attempt to conceal certain elements specifically on iPhone 5 & 5S in both portrait and landscape orientations, but unfortunately, it ended up affecting all iPhone devices. Below is the code snippet used:

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) { 

span.hmlabel{
display:none;
}

}

Answer №1

Feeling drained, but everything is functioning flawlessly.

@media screen and (device-aspect-ratio: 40/71) {
  span.hmlabel{
    display:none;
  }
}

@media screen and (device-aspect-ratio: 71/40) {
  span.hmlabel{
    display:none;
  } 
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the process for extracting text from one input field and using it as a placeholder in another input field?

I am developing a form creator that allows users to easily customize placeholder text for input fields. Users can simply type their desired placeholder text into a separate input field. Here is my current approach: HTML: <label>Title</label& ...

Validating decimals in a text field with either JavaScript or jQuery

I need to implement text field validation on the keyup event. The text field should only accept money type decimals such as: (12.23) (.23) (0.26) (5.09) (6.00) If any incorrect value is entered, it should revert back to the previous value and remove the ...

Conceal and reveal elements using v-if

Check out my fiddle: DEMO creating a new Vue instance: { el: '#app', data: { modules: ['abc', 'def'] } } I am looking for a way to hide or show elements using v-if based on the values in an array called modules[]. ...

What could be causing the constant undefined response when using ajax to post to php?

I have been using a mouseover event on a span element to trigger an ajax post call to a php page. However, I keep getting undefined values - first for responseText when using a simple echo to get the response, and now with responseXML. Can someone please h ...

The appearance of the logo varies across various web pages on the site

Isn't it strange that my logo appears pixelated only on the home page, even though I used the same HTML and CSS code for all pages? The Html: <a href="Home.html"><img id="logo" src="../CONTENT/Images/Logo/1Sr2l8а.png" alt="logo"/></ ...

When using Object.getOwnPropertyNames(window), the setTimeout function is not included in the resulting array

The issue at hand is that when using Object.getOwnPropertyNames(window), the setTimeout value is not included in the returned array. Why is this happening? In an attempt to further investigate, I tried checking the property descriptor object of the setTi ...

What are some ways to design unique custom data grid toolbar elements?

I am having trouble syncing my custom toolbar buttons with the imported material data grid toolbar components. I would like them to match in style, specifically applying the material styles to my custom components. However, I have not been able to find a w ...

Using PHP to track the number of clicks on a specific div element

Although I am not well-versed in javascript, I have incorporated it into my website to enhance its appearance. One of the features I've added is a popup that appears when a user clicks on a specific div element to display additional information. In ad ...

What is the best way to automate a website that has identical buttons with the same class, but different HTML onlick functions?

One of the buttons reads <button class="btn bid-hotel-btn" type="button" onclick="buyNow(0,false)">Beli Sekarang</button> while the other button is <button class="btn bid-hotel-btn" type="button" onclick="buyNow(1,false)">Beli Sekarang ...

Filtering an object using data in AngularJS

My current data object structure looks like this : $scope.data = [ { "name": "1001", "queue": [ { "number": "111", } ] }, { "name": "1002", "queue": [ ] ...

Is there a way for me to choose the item from the search dropdown so that it fills in the search input field automatically?

Upon typing a word into the search input field, a list of suggestions will appear below. https://i.sstatic.net/etOBI.png Is there a way for me to select a word from the list like Maine (ME) and have it automatically fill the search input field? What chan ...

I've encountered an issue where my React website functions correctly on the development server but not on the live website. Where should I start investigating to find the cause of this discrepancy?

I am trying to embed a Datawrapper map using the following code: import InnerHTML from 'dangerously-set-html-content' export function Map1(){ const htmlFile = `<div style="min-height: 374px"> <script type="text ...

How can Three JS and an image be combined to make a custom 3D cookie cutter?

I am currently working on a project that involves extracting the edges of a black and white image. My goal is to then generate a 3D model that highlights the edges of the black shape, extrudes the edges for depth, adds thickness to the walls, and creates ...

What could be the issue with my JSON file?

I am currently utilizing the jQuery function $.getJson. It is successfully sending the desired data, and the PHP script generating the JSON is functioning properly. However, I am encountering an issue at this stage. Within my $.getJSON code, my intention ...

What is the best way to retrieve a specific children element from a JSON object in JavaScript based on a keyname and value match

Recently, I encountered a JSON data structure that looked like this: var jsonData = { "id": 0, "content": "abc", "children" : [{ "id": 1, "content": "efg", "children" : [] } { "id": 2, "c ...

To begin, formulating a blank state entity containing a collection of key-value pairs with JSON objects as the values. Subsequently, modifying the contents of

I am working on setting up a reactJS state with an empty array to start. When I receive a message in the form of a JSON object, I want to add a key-value pair to the array, using the received message as the value and a specified key. For example: We have ...

Submitting a form in PHP without refreshing the page

I am facing an issue with posting my form to Mysql without refreshing the page. I have tried looking for solutions online, but nothing seems to work. Can anyone assist me with this? <script> $('#submit').click(function() { $.ajax({ ...

Determining the height of child elements within a React component

One challenge I'm facing inside a React component is the need to calculate the total height of my child containers, specifically the three h3 elements, in order to accurately determine the height of my parent div during a transition animation. While I ...

Certain javascript files have had illegal characters mistakenly added to them

There seems to be an issue with the js files or server on certain pages, as they are not loading in Firefox: with firefox: SyntaxError: illegal character 癡爠浥湵楤猠㵛≶敲瑩捡汭敮產崻 ⽅湴敲⁩搨猩映啌敮畳Ⱐ獥灡牡瑥 ...

HTML sends a request prior to the loading of AngularJS

When including an HTTP request in the HTML, I encountered this issue: <img src="/api/profilepic/user/{{user.id}}"> The actual request URL is: Request URL:https://example.com/api/profilepic/user/%7B%7Buser.id%7D%7D As a result, the request keeps b ...