On 11/9/10 12:40 PM, TriState Advantage, Kris Jacobson wrote:
I have been studing the info lately about making a site mobile device friendly.
I would like to take an existing site and create a seperate style sheet so that
it is mobile friendly.
On the tutorial I studied, you replace the existing header graphic with a
smaller one by using the background-image tag for the div in the CSS in the new
stylesheet.
What I have a question about is the original header. It is a graphic placed
there by the image tag in the html. To change this site over I would have to
remove the image tag in the html and replace it with the background-image
selector in the CSS style sheet of the original site?
Is this correct usage of the background-image selector?
Would I need to change the doc-type to do this? I usually use transitional as I
quite often prefer to have certain pages open up in their own window. (I have
read all the discussions about this and I disagree)
Thanks for any advice.
Kris
I am not familiar with that particular tutorial.
If the existing header "desktop" image is in the markup, then one way to
do it is to place the "mobile" image in the markup, too.
In the styles for "desktop" assign display:none; to the "mobile" image.
And in the styles for "mobile" assign display:none; to the "desktop" image.
Use CSS3 Media Queries <http://www.w3.org/TR/css3-mediaqueries/>
The URL, doctype, and stylesheet is the same for desktop and mobile.
Best,
~d
--
:: desktop and mobile ::
http://chelseacreekstudio.com/
______________________________________________________________________
css-discuss [[email protected]]
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/
