Have you checked the settings of the Widget? They contain options to adjust the text size. Otherwise you can alter it’s source code to set your own preferred css font sizes ext.
Whats you tabled screen size in pixels? I will see if I can find why it looks like that on this resolution.
1280 × 800 pixel …
Try this.
- Go to your Custom widget list ( Manage button in the settings screen)
- Click on the OpenWeatherMap widget
- On the Code tab, replace all instances of “col-md-VALUE” to “col-VALUE”
- Remove the “md” but don’t change the values!
- Save in the top right corner
- Refresh your Habpanel, you do not need to replace the Widget on the Dashboard. It will automaticly use the new code.
Same result on tablet and pc browser too.
But it works fine with “col-sm-”
That doesnt make sense.
This value determines when a column should be placed below each other. Each value, sm, md-, lg represents a certain width. When using “col-” it will not stack columns.
Same thing with me. col- didn’t work but col-sm did!
What I’m not seeing now is the setting to adjust text size. All that is there is for icon size.
Oh also, wind speed is still displayed as k/m rather than mph. Didn’t see anything in the code to fix that.
The widget looks great! Thanks for the effort you’ve put in this, @bastiaan_van_h
I have changed all col-md to col-sm and it works on my PC, but not my iPhone 7 Plus 
EDIT: I guess it’s the weekday names (full names) requiring the width.
How to set the weekdays to the short versions (Mon, Tue, or Mo Di accordingly in German)?
Oh also, wind speed is still displayed as k/m rather than mph. Didn’t see anything in the code to fix that.
Found the problem, change the windspeed item to:
Number:Speed Weather_OWM_Wind_Speed "Windspeed [%.1f %unit%]" {channel="openweathermap:weather-and-forecast:<your-id-here>:local:current#wind-speed"}
It replaces the km/h with the variable %unit%.
Found it:
Juste needed to replace | date:'EEEE' with | date:'EEE'
The forecast is still stacked on top of each other…
xs di the trick (instead of the original md) - even though my iPhone7 Plus screen’s resolution is 1080 pxl… ?!
in the central styles.css you can find the size definitions:
.h1 {
font-size: 36px;
}
h2,
.h2 {
font-size: 30px;
}
h3,
.h3 {
font-size: 24px;
}
h4,
.h4 {
font-size: 18px;
}
h5,
.h5 {
font-size: 14px;
}
h6,
.h6 {
font-size: 12px;
}
so to adjust the size of you text, you just need to change the code in Habpanel:
e.g.
<h4>{{'%.1f' | sprintf:itemValue('Weather_OWM_Temperature').split(' ')[0]}} {{itemValue('Weather_OWM_Temperature').split(' ')[1]}}</h4>
to
<h5>{{'%.1f' | sprintf:itemValue('Weather_OWM_Temperature').split(' ')[0]}} {{itemValue('Weather_OWM_Temperature').split(' ')[1]}}</h5>
to get one size smaller (in this case 18px to 14 px)
Thank you, that worked! @bastiaan_van_h had said that it was in the widget settings and it isn’t but I wouldn’t have figured this out for a while. 
That did it. The widget looks almost perfect now.
You read my mind, I wanted to make this change also. I was going to build a transformation but this solution was much easier.
Hello, congratulations for the great widget.
Can I ask for some clarification? Frankly I do not find myself with the path. In / etc / openhab2 / I have no conf, also in the zip of the icons I can not find any images folder containing the PNGs but only the svg. I can not find the HTML where to enter the id of my item.
I’m a beginner with openHAB I guess I miss some basic notion. Could you give me a little more basic instructions on how to make the widget work? At the moment I only have a square full of N / A
/etc/openhab2 IS the conf folder.
So you need to unpack the zip into:
/etc/openhab2/html/openweathermap
additionally sou need the images from the top of the github site:
my screensize is 1024*768.
I tried col-sm and col-xs but both don’t seem to change anything…
changing the fontsize via h4 etc. lowers the fontsize but then it looks like that:
how can one move the condition icon below the condition text?
I’d like to do that also, but my more pressing problem is the current conditions on the right side. They don’t quite fit in the space allowed.
The ºF is on the second line. I tried shrinking the font size and it didn’t look good and it didn’t work. How can I adjust the width of that column? Just moving it a few pixels should do it, I think.
I’ve put in a PR for this functionality. There is a config item to allow custom date formats. Don’t think it’s been pulled though.