Unable to validate css: media queries

Hi cpradio

I’ve justtried to delete thwe offending line in the script and I end up with a pop-up that displays the sidebar and as there is no space for the popúp proper, this comes under the sidebar!

So, to continue with this idea I have to maintain that line.

What I need now is to sorrt out the media queries which I can’t make head or tail of them!

Huh? That line is already being handled by the media queries. You simply put display: none in the appropriate media query for #outside and it hides it for you on window sizes that won’t let it fit well – no need for JavaScript.

Also, I think a lot of the issues you are experiencing (the transition) are due to using float: right instead of float: left. float:left would make the space on the right larger as the browser window width is increased, but not physically move the content (making it seem more “seamless”).

hi cpradio

If you reply in th next 5 mins, I can take out the line from the script for you to see what happens to the pop-up. That is the reason for the line, even though it does not do the job entirely as the sidebar appears briefly while the pop-up loads.

as for the media queries, the display:none is there but to do something different to get rid of the sidebar in the full page (not the pop-up)

Anyway, I managed to get somewhere withe queries and it now progresses properly as ithe screen is narrowed. The only problem (minor, as I decided that I have to find another answer to this page) is that the main content squashes against th sidebar as it gets narrower. I have tried margins and paddings and nothing works. Do you have a solution? Please look at http://pintotours.net/Oceania/Australia/airportSyd.html.

Thank you

Are you referring to the content in the white background (the sidebar) or the main content?

I’ve taken the line out but will put it back in about 10 mins.
In my computer, without yje line I see only the sidebar on the left; the main content is way down the pop~up page because it idoes not fit, as the sidebar took away the space.

With the line in the script that sidebar flashes as the page loads but disappears and can only be seen briefly again if you press F5.

Do you have a solution for creating a little space betwen the divs in the queries? Maybe a very narrow div with visibility:hidden?

No, the only thing I can think of is using your JavaScript line for the inline style to also remove the float, using float: none for the box class and set its width to auto.

That way, when the popup window opens, the sidebar is hidden, and the content is no longer floated and will take up the maximum width it can.

Hi cpradio

I could not find the thread last night and I am only back as I followed the link in the eamil I received now.

I ended up giving up on that attempt and used some code I had been given, which works fine and is now live.

many thanks for your help,

Regards

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.