What type of css selector do i need for this mobile problem?

Hi from freezing and wet York UK…

In the mobile version of www.davidclick.com i would like to just see the email address and tel number on the home page. In other words i want to display just the email and tel number and hide the rest when viewed on an Iphone for example.

Here is the relevant code:

[code]



davidclick.com


Wedding photographer



56 Manor Park Road


York


North Yorkshire


YO30 5UL



Phone: 01904 338804 Mobile: 077520 28747


eMail: david@davidclick.com


[/code]

And the css that didnt work:

[code]

p span[title=“nodisplay”] {
display:none;
}[/code]

I though if i bolted on a title=“nodisplay” the css above would knock that out but nope I cant figure it out :frowning:

Here is my problem illustrated:

Wouldn’t it be better to use a class=“nodisplay” rather than use the title attribute?
That class could possibly be applied to a common wrapper instead of numerous elements, if they are bunched together.

And not css related, but a tip for phone numbers. you can wrap the number in an <a href="tel:mynumber" title="Call Me">
Just like mailto in the email, it will allow mobile users to tap to call.

4 Likes

As @SamA74 said, use a class, not the title attribute here. The title text will display as a tooltip on hover, and will be read out by screen readers, which is not what you want here. (I’m also bemused as to why you’ve wrapped the entire content of each <p> in the address in a span. I may be missing something, but they look entirely superfluous to me.)

Thanks SamA74 your solution fixed it :slight_smile:

Hi technoBear, regarding …“Bemused…” I got the code from here: https://schema.org/address and when i need to change to microdata apparently thats the way you have to do it, maybe Ive got something mixed up :frowning:

Hmm … it’s not very clear from that, but it looks as if they’re using <span>s to mark up sections of text placed directly within a <div>. You have your text broken down into sections using <p> tags, so I’d have thought you could add the itemprop directly to those.

1 Like

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