Replace <span style="float:right"> with <span style="position:absolute; right:0"> and add GM_addStyle('.related-list-item .content-link {width:170px}');
BTW I think that the X should be at least two times smaller, maybe even 4x. It's way too obtrusive especially with dark themes:
And you updated. Thanks looks like it's going to work. Duh!
As to the icon, it is almost the same size as the text below. I prefer it large, but I will try and add a setting for smaller icon in the filter menu in the next release.
Spoke too soon. Small sized screens cause issues.
Eh?
I had that ".content-link" width over 200px due to wide screen as otherwise the gap looks large. It also seems anything below 1024px wide, causes overlap at 170px.
It still the best solution if I can't figure out the cause of why the styling breaks unless you do a video resize. Figuring the best width for content-link, dynamically, shouldn't be an issue.
What about putting the X outside of the block: position:absolute; right:-32px;?
Thus there's no need to use GM_addStyle to alter .content-link width.
It would look great on your screen. Problem is, in the default colouring scheme it would land on two background colours.
Well, it'd be probably quite fine if you downsize the X two-three times...
Maybe. It just I prefer larger buttons. Dynamically working out the size isn't much of an issue, though, not knowing why the problem exists in the first place is a major annoyance. I would really like to know why.
Thanks, I used your solution. To get the smaller buttons just remove the quotes from the GM_setValue("PageType2".. in the script.
/************** [VYCS] Variable you can set **************/
//CSS Style for video page. It uses smaller text and icon for the block button and image link
//GM_setValue("PageType2",".blockBox .blockBTN32 {width: 24px; height: 24px;} .blockBox a {font-size: 10px;}"
// + "body #watch7-sidebar-contents {padding: 15px 0px 15px 5px !important;}"
// + "#watch7-sidebar-contents .video-list-item.related-list-item {padding-right: 24px;}");
//CSS Style that limites the size of the search list width, if increased by "Youtube Center"
//GM_setValue("PageType1",".ytcenter-site-search .yt-card.clearfix{width: 700px !important;}");
/**************************************************/
Youtube Filter CSS bug
Hello,
Need advice on how to fix the issue displayed in the attached image for the script Youtube Filter. I've been unsuccessful in finding a fix and any input is appreciated.
The error is displayed when you go to a video and the recommendations are on the right side. The video has to be in a small video. Once you resize the video the error is fixed, then you can go back to small size video and the error is no longer present.
Example video link
Thanks