Hallo !
De site www.windfinder.com stelt widgets ter beschikking om de windvoorspelling voor de volgende dagen op je website te krijgen. Mijn bedoeling is om drie van die widgets op één pagina samen te brengen. De code die men aangeboden krijgt is een div met daarin een script om de widget te genereren. Ik heb dus drie van die div's samengebracht in een HTML-file:
Als ik die file open in een browser dan krijg ik mooie windvoorspellingen, maar de div's worden onder elkaar geplaatst. Zie screenshot1.jpg.
Geen probleem, dacht ik zo, ik zet gewoon een float:left bij die div's en dan komen ze wel naast elkaar.
Deze code werd dus bijgevoegd in de <head> van de HTML-file:
En inderdaad, de div's komen nu mooi naast elkaar, maar .... de kleuren van de balkjes die de windsnelheden voorstellen, zijn verdwenen !!! Zie screenshot2.jpg.
Ik heb al van alles geprobeerd maar ik krijg dat niet voor elkaar. De kleuren blijven weg. Dit verschijnsel doet zich voor bij Chrome, Firefox en IE.
Iemand een idee ?
Grtz,
MDN111.
De site www.windfinder.com stelt widgets ter beschikking om de windvoorspelling voor de volgende dagen op je website te krijgen. Mijn bedoeling is om drie van die widgets op één pagina samen te brengen. De code die men aangeboden krijgt is een div met daarin een script om de widget te genereren. Ik heb dus drie van die div's samengebracht in een HTML-file:
Code:
<!DOCTYPE html>
<HTML>
<head></head>
<body>
<div style="font-size:1.0em;"><script type="text/javascript" language="JavaScript" src="http://www.windfinder.com/wind-cgi/homepageforecast.pl?STATIONSNR=nl77&UNIT_WIND=bft&UNIT_TEMPERATURE=c&VERSION=2&UNIT_WAVE=m&UNIT_RAIN=mm&NUM_COLS=1&NUM_DAYS=4&SHOW_DAY=0&LANG=en&SHOW_PRESSURE=0&SHOW_WAVES=0&SHOW_CLOUDS=0"></script><noscript><a href='http://www.windfinder.com/forecast/borssele?utm_source=forecast&utm_medium=web&utm_campaign=homepageweather&utm_content=noscript-forecast'>Wind forecast for Borssele</a> provided by <a href='http://www.windfinder.com?utm_source=forecast&utm_medium=web&utm_campaign=homepageweather&utm_content=noscript-logo'>windfinder.com</a></noscript></div>
<div style="font-size:1.0em;"><script type="text/javascript" language="JavaScript" src="http://www.windfinder.com/wind-cgi/homepageforecast.pl?STATIONSNR=nl120&UNIT_WIND=bft&UNIT_TEMPERATURE=c&VERSION=2&UNIT_WAVE=m&UNIT_RAIN=mm&NUM_COLS=1&NUM_DAYS=4&SHOW_DAY=0&LANG=en&SHOW_PRESSURE=0&SHOW_WAVES=0&SHOW_CLOUDS=0"></script><noscript><a href='http://www.windfinder.com/forecast/neeltje_jans?utm_source=forecast&utm_medium=web&utm_campaign=homepageweather&utm_content=noscript-forecast'>Wind forecast for Neeltje Jans</a> provided by <a href='http://www.windfinder.com?utm_source=forecast&utm_medium=web&utm_campaign=homepageweather&utm_content=noscript-logo'>windfinder.com</a></noscript></div>
<div style="font-size:1.0em;"><script type="text/javascript" language="JavaScript" src="http://www.windfinder.com/wind-cgi/homepageforecast.pl?STATIONSNR=nl251&UNIT_WIND=bft&UNIT_TEMPERATURE=c&VERSION=2&UNIT_WAVE=m&UNIT_RAIN=mm&NUM_COLS=1&NUM_DAYS=4&SHOW_DAY=0&LANG=en&SHOW_PRESSURE=0&SHOW_WAVES=0&SHOW_CLOUDS=0"></script><noscript><a href='http://www.windfinder.com/forecast/strijen?utm_source=forecast&utm_medium=web&utm_campaign=homepageweather&utm_content=noscript-forecast'>Wind forecast for Strijen</a> provided by <a href='http://www.windfinder.com?utm_source=forecast&utm_medium=web&utm_campaign=homepageweather&utm_content=noscript-logo'>windfinder.com</a></noscript></div>
</body>
</HTML>Als ik die file open in een browser dan krijg ik mooie windvoorspellingen, maar de div's worden onder elkaar geplaatst. Zie screenshot1.jpg.
Geen probleem, dacht ik zo, ik zet gewoon een float:left bij die div's en dan komen ze wel naast elkaar.
Deze code werd dus bijgevoegd in de <head> van de HTML-file:
Code:
<style type="text/css">
div {
float: left;
}
</style>Ik heb al van alles geprobeerd maar ik krijg dat niet voor elkaar. De kleuren blijven weg. Dit verschijnsel doet zich voor bij Chrome, Firefox en IE.
Iemand een idee ?
Grtz,
MDN111.
Bijlagen
Laatst bewerkt:
