i can only get size to stays within a container that has a fixed size (1000px for instance)
but i can’t get it to be something relative, so when the size of the screen changes, the container size also changes.
if there is anybody who knows more on how to do it, i can use some help.
thanks in advance.
You can use the lesser known “viewport width/height” setting which I think works similar to e.g. width: 100%; but instead adapts the size of your divs to the browser window size:
width: 90vw; which works if you combine it with overflow, for example overflow-x: auto;.
Also here’s a nice tutorial if you want to try out the more advanced scrolling options I mentioned (section about “Sticky rows and columns”):
Thanks @joiletjake!
@sanojjonas,
I tried on my screen and for your 2 div#bottom1 and div#bottom2 in artist page, I have set width: 76vw; instead of width: auto;.
It’s the maximum value I could set before altering MB split width between content and sidebar.
I don’t know if it’s same on others’ screens.
And overflow-x: auto; is already set, no changes needed.
Weird, maybe it’s a browser thing, I use firefox and screen width 1920 (but that shouldn’t matter). If I set it to 90vw the userscript divs have the same width as the MB release group div above it and they both have the same width until you make the browser window width very small.
Ach, so, maybe it’s not that easy or there is a better way.
Note: I was on Windows Vivaldi with zoom at 100% (no zoom), and whatever my window size was, things were following the main content width nicely, without tampering MB layout, with width: 76vw.
At 90ew, main content column got enlarged and sidebar got pushed further rightwards.
Now I think that we have to have a look at the styling of the release group tables, and mimic them.
No, as your table needs to be wider, of course…
thanks @joiletjake and @jesus2099
i pushed a fix so now the ui should not break
Great! It works great on desktop and on landscape screens in general.
Though I made a little 76vmax merge request, to make it work on all screen orientations (portrait and landscape).
Could you please check if it works on your computer too, before merging?
Now it works good on smartphone Android Kiwi Violentmonkey and on Windows Vivaldi Violentmonkey, on my side.
i tested it on my mcbook and checked it in browser with some mobile device resolutions and it looked fine so i merged it.
Are you in zoom 100% (no zoom)?
Try hitting Ctrl+0 to reset the zoom.
With no zoom, in Chrome based browsers, 76 (vmax) is doing the trick.
Indeed if I zoom in or out, it changes. Which is a little bit of a pity for our solution, actually…
Agreed!!
Another long-wanted feature that this implements is showing links to all the bands someone is a member of, without first clicking through to the relationships tab:
(it’s not obvious in the screenshot but all the bands are clickable)
Maybe would be a nice hint to underline the bands like URLs often get underlined?
Have already been having fun discovering via clicking bands this way.
the line isn’t there because of css from the music brainz website itself (it will get a line when you hover it.
i changed the colors of the to black (with a white hover state) because with the colors sometimes the contrast made it difficult to read.
but in the latest version, i removed this css. so urls should look the same as other music brainz urls
A curious question: EMF - Relationships - MusicBrainz
Sorry, I break things cos I test different. Here we have a band where there are joining dates for all, but no leaving dates as they are all still there.
Can I point this example your way to do a bug fix with as none of them are appearing in the graph. Is this because they lack instruments, or the way the date is done?
Yep 100% zoom no screen scaling in Windows. The userscript table div is 1459px which is 76% of 1920. Maybe you have a laptop with screen scaling enabled? I tested on my laptop and the div does become wider and I get similar/same result as you with 76vmax if I use the recommended 150% scaling in Windows 10 with 100% browser zoom.
But yeah it’s not an optimal solution. On the relationship tab I now need to change the value to 85 (instead of 90 on the overview tab) to match the width of the table above it (1632px which is 85% of 1920) and if I go above that it breaks the layout. The zoom thing is also annoying but that’s apparently by design. Keeping it at a lower value is probably for the best.
I tried on:
In these setups, with 76vmax, userscript divs have the same width as the MB release group div above it.
But you it’s with 90 instead of 76… 
My second setup looks like yours but then the only difference is Firefox vs Vivaldi?
I guess I’ll have to install Firefox on that desktop…
It would also be nice to find a solution that’s unaffected by the desktop zoom.
For the artist Bruce Springsteen the history doesn’t get rendered. Is it maybe because of the more than 4000 event entries ?
its a combinations of no instruments + original.
the “original” tag is in the same array as the name of the instrument.
fixed it
it is, i pushed a fix for this
history is currently only shown on bands.
bruce springsteen is a person. i still have to fix that.
