Archived

This topic is now archived and is closed to further replies.

  • 0

How do I use multiple classes with browser specific classes?


Question

Posted · Report post

Hi!

I have:

body.android .section-branding .mainlogo-link, body.android .section-branding .mainlogo-img {
}

Which works great and fine and good, but I need to apply multiple classes (.ipod, etc). My small, unexercised css brain is getting boggled my multiple classes and selectors. Do I need to do the above for each browser class or is there a shorthand way to do this that is good and clean and easy?

 

Please help :)

 

Bree

Share this post


Link to post
Share on other sites

5 answers to this question

Posted · Report post

Hello Bree,

 

Yes, unfortunately, to apply custom CSS for specific browsers, you have to replicate and edit the code for each browser, but I think it's possible (when the instruction is the same) to do things like:

.ipad .iphone .android #page....{the same instruction}

 

It's only when you change the instructions that you need to have a new line.

Share this post


Link to post
Share on other sites

Posted · Report post

I'm using that plugin and went through the documentation already. What I want to know is if I need to do:

body.android .section-branding .mainlogo-link, body.android .section-branding .mainlogo-img {
}

body.firefox.section-branding .mainlogo-link, body.firefox.section-branding .mainlogo-img {
}

for EACH browser I want to target or if there is a shorthand way to write this.

 

Thank you,

Bree

Share this post


Link to post
Share on other sites

Posted · Report post

Awesome- thanks!

Share this post


Link to post
Share on other sites

Posted · Report post

You're very welcome.

Share this post


Link to post
Share on other sites