> On Saturday, September 13, 2014, Paul <cssl...@bassonhook.com
> <javascript:_e(%7B%7D,'cvml','cssl...@bassonhook.com');>> wrote:
>
>> Hello everyone, I am relatively new to responsive design and css with
>> media queries and have used an online tool to generate my template and
>> then customized it as I went along to try and learn. I seem to have it
>> working well as far as I can see without actually viewing on smart phones
>> but I cannot seem to get my call button to work in ff 32.0.1 or Chrome
>> 37.02 but it works in Safari 5.1.7, IE 11 and Opera 12.16. Not sure about
>> older browsers.
>>
>> The code I used is this:
>> html - <a href="tel:1-555-555-5555"><img class="call"
>> src="images/callbutton.png" alt="call button" /></a>
>> css - .call {display:none;}
>> media query - /* Phone Landscape (480px) */
>> @media only screen and (min-width: 321px) and (max-width: 480px) and
>> (orientation: landscape){.call {display:run-in; }}
>> and
>> /* Phone Portrait (320px) */
>> @media only screen and (max-width: 320px) {.call {display:run-in; }}
>>
>> Site can be viewed temporarily at:
>> http://www.sportsmanfishing.com/webdev/index.html
>>
>>
>>
I usually develop mobile first with all my base styles for phone width. My
first break point MQ is usually 'min-width: 30em' (480px).
--
Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
