-2

Sometimes, when I load a page on the Internet on my phone or tablet, it does not look right. Is it possible to inject custom CSS into a page on these devices?

UPDATE:

  • I am the developer of the site, but it would be cool to change the site without login and to add it to the browser. So only I can see it and I do not have to login.
  • Browser plugin would not be sufficient. The idea is to add pieces of CSS inside a "webview" on the iphone/ipad for a specific page.
Kara
  • 6,115
  • 16
  • 50
  • 57
  • do you mean as a visitor or as a developer ?? – MujtabaFR Jul 31 '14 at 17:27
  • 1
    https://addons.mozilla.org/en-us/android/addon/stylish - Stylish is a great Firefox plugin for modifying pages' css the way Greasemonkey does for javascript, and it looks like it's supported for Firefox for Android. (That said, this doesn't appear to be on topic for SO, as it isn't a question about programming or a programming tool.) – neminem Jul 31 '14 at 17:28
  • You can do such thing using Google chrome developer tools, also there are similar tools in FireFox an IE – MujtabaFR Jul 31 '14 at 17:28
  • Some browsers let you specify a CSS file that you want applied to all pages you browse, but AFAIK mobile Safari and Chrome don't offer this. – Blazemonger Jul 31 '14 at 17:30
  • @Blazemonger chrome can do this if the phone is connected to the computer, so you can control and edit the pages in the Chrome mobile from Chrome desktop – MujtabaFR Jul 31 '14 at 17:32
  • @MujtabaFathel Great, although that's obviously only useful as a development tool. – Blazemonger Jul 31 '14 at 18:56

1 Answers1

0

If I understand your question well, you want to create mobile-specific CSS to fix your website's viewing, is that right? If so, you can use CSS's media queries for so, like this:

@media only screen 
   and (min-device-width : xxx px) 
   and (max-device-width : xxx px) 
   and (orientation : landscape or portrait)
   and (min-resolution: xxx dpi){ 

   // your css goes here

}

Here are some links that might help you:

http://help.campaignmonitor.com/topic.aspx?t=164

How to apply different CSS for mobile devices not just based on media width/height

http://css-tricks.com/snippets/css/retina-display-media-query/

Community
  • 1
  • 1
Yago Arroyo
  • 38
  • 1
  • 9
  • 1
    I could be wrong, but I think that the author wants to insert CSS into other people's pages. – randak Jul 31 '14 at 17:38