alefmemalef

Hi again Kelly or anyone else PLEASE!!! I've had a look at 'Responsivizer' and it seems like a fantastic extension but.. the website I've been asked to make responsive is a bit messy and the extension requires some more order and clarity. As I said - the media-queries.css file I worked on for quite a bit of time does do the job on various simulators and since I've been through the process of creating responsive websites before I am quite sure the job has actually been done. What I need to know is whether there is some code that could be responsible for making actual, real devices ignore the media-queries.css file. Julia, you suggested I show the code and I'd like to know which code could be helpful to determine where the problem is coming from? Thanks

Thanks Kelly for your response. What code would be helpful?

Hi, I have been asked to turn an existing Joomla 2.5.16 website into a responsive one. I created a media-queries.css file and adjusted all the styles using Firefox's Responsive Design Tool to test the results. All was fine until tested on real devices - both iPhone and Xperia - on both the website is totally unaffected by the media-queries.css file. I've tested the site with online simulators and although they show a less than desired outcome - they do show that the media-queries.css file is making a difference. I hope this is the right forum to post this issue as I realize it's not strictly a css problem that I'm facing. I would be grateful for any advice - are there scripts that could be blocking it or anything else I have to check? Thank you

I also tried removing the ; from the :lang(he) body { font-family: "Narkisblockregular", Arial; font-size: 14px; color: #154d66; :lang(he)}:lang(en) {font-family:Arial, Helvetica, sans-serif; font-size: 90%;} And I also tried replacing <meta http-equiv="Content-Type" content="text/html; meta charset="utf-8"> with <meta charset="utf-8"> But nothing works...

Yes, I have linked to the font. Now this is what I have in the head of my index.php file: <meta http-equiv="Content-Type" content="text/html; meta charset="utf-8"> and this is what I have in my css file body { font-family: "Narkisblockregular", Arial; font-size: 14px; color: #154d66; :lang(he);}:lang(en) {font-family:Arial, Helvetica, sans-serif; font-size: 90%;} But it's not working - see in the first line of this page: http://helppc.co.il/comps/computing-solutions Thanks

Thank you! Will check in the right places how to do that.

How would I do it in an inclusive way? Every page in this website has a background slideshow consisting of 3 different images, all in all I have around 60-70 images.

Hi, With the kind help of dsonesuk I learned recently that position:fixed is not fully supported by mobile devices and reverts to position:absolute. Here's my situation - The website I'm building for my client has a background slideshow that has to fill whatever screen it's viewed on and stay fixed whilst the content scrolls up over it. The slideshow therefore gets a position:fixed attribute. Sadly, on mobile devices the content does not scroll over it but continues beyond the bottom edge of the background image which is determined by the size of the screen, and that looks bad. So my question is - Is there a way to make the content scroll up over the background slideshow on mobile devices? Thanks

I'm doing quite a bit - img sizes, font sizes, different image sprites....

Dsonesuk hi again, After getting your colleague's help with media-queries.css and having fixed it, I now know that the css file is targeting devices properly so I am going back to my question following your reply from earlier on: Thanks

Hi, I found out that I do need to give a max-width to each one of them that is 1px less than the min-width of the next size up. That fixed it.

Thank you so much Newseed!! Wish I could have come across this information weeks ago.... I have a new problem though - the appearance of the website on the computer screen has been damaged now. I've tried giving the largest resolution I have a max-width as well but it hasn't helped. How do I make media-queries.css not affect the appearance on my computer screen?

oops, just saw I've got a reply from newseed regarding media-queries-css so I'll check that.

Thanks again Dsonesuk. That is incredibely important information!! I've tried position:absolute and now I notice that what you wrote is that this is something that happens automatically(?) Anyway... if this happens automatically, is there a good way to get around it? If what you did mean is what I originally understood, then using position:absolute did make the whole background image stretch in portrait position to fill the screen and all the content gets reduced respectively, but in landscape I still get the content continue past the image which means scrolling and going past the bottom edge of the background image. Now I'm not sure if this is not happening because of other problems I'm facing with clashes I think I might be having in my media-queries.css file. I posted a topic regarding that and I would be really happy if you could look at it as well. Cheers

Thanks a lot. I realise I actually missed the point and the problem lies elsewhere - on mobile devices the image scrolls together with the content and this is not what it should be doing. On computer screens the slideshow does in fact stay fixed (which is fine, that's what I need it to do) and the content scrolls vertically over it. Are you able to determine why this is not the case on mobile devices?