CSS Problem with EWN Forecast Page

Greetings,

I wonder if someone would be kind enough to assist with a css issue I have …

The CSS of my European Weather Network forecast page is breaking the width of my menu drop down buttons and the width of the container of the main section of the page.

http://www.leavening.org/forecast/ewn/

It appears to be something in the bootstrap css because without that (although the page obviously doesn’t work) the alignment is okay.

I made a new page to show this which excludes the following line :-

You can view it here :- http://www.leavening.org/forecast/ewn/index2.php

The page itself looks correct but the EWN forecast is all over the place.

#confused

Regards, Simon

Just incase anyone is interested …

I found the exact bit of CSS which is breaking my page :wink:

*, :after, :before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

It’s in the bootstrap css and removing it breaks the EWN bit. Leaving it in breaks everything else.

Suggestions on a postcard to Leavening!

Have a great day everyone :wink:

S.

The easiest solution is to run the forecast in an iframe.
Then both your page with the iframe and the EWN forecast are handled independently of one another in the browser.

Wim

Hi Wim,

I would put it in an iFrame if I could dynamically resize the height of the frame. Setting it to a high value to fit the longest forecasts looks terrible most of the time.

An attempts I’ve made to do this have, so-far, failed.

Thanks, Simon

Well, I gave up & deleted all of my attempts to incorporate the EWN version of my WXSim forecast.

The CSS is just too difficult for me to understand I’m afraid. Nobody else was able to give me any assistance either so perhaps it was always a waste of time trying.

I’ve put it back up as an iFrame as per Wim’s suggestion and made an attempt to resize the frame however it’s actually the page length which is causing the issue with the scrollbars.

Not entirely happy with this solution as I think it looks a bit scruffy; better than nothing though.

See my efforts here if you’re interested :- http://www.leavening.org/forecast/ewn/

Adios for now … Simon