Solved - Huge White Border Around Top Site Thumbnail

CraigS26
2StarLounger
Posts: 141
Joined: 02 Nov 2016, 12:56

Solved - Huge White Border Around Top Site Thumbnail

Post by CraigS26 »

https://i.imgur.com/K7XHrNB.jpg

(FF 94) Thanks to a special member(s) in the Mozillazine FF Support Forum I have restored my Top Sites Thumbnails to Full Images with NO HUGE WHITE BORDER as follows (My New Tab Page is 80 Top Sites, SO THIS is a Nice recovery):

In your Profile Chrome Folder create a New Folder — userContent.css — via the same Notepad method used for userChrome.css creation. Enter the following & Save.

Note: A early-post formatting error in the css script was corrected with Help from Hans.

Code: Select all

/* about:home - about:newtab */
@-moz-document
  url-prefix(about:newtab),
  url-prefix(about:home) {
   .top-site-outer .tile .icon-wrapper {
     height: 100% !important;
     width: 100% !important;
   }
   .top-site-outer .default-icon,
   .top-site-outer .search-topsite {
     background-size: 100% !important;
     height: 100% !important;
     width: 100% !important;
  }
Last edited by CraigS26 on 03 Dec 2021, 15:34, edited 2 times in total.
Win 10 Pro 21H2 | ESET EIS | Mbam Prem | SuperAS Pro

User avatar
HansV
Administrator
Posts: 74154
Joined: 16 Jan 2010, 00:14
Status: Microsoft MVP
Location: Wageningen, The Netherlands

Re: Solved - Huge White Border Around Top Site Thumbnail

Post by HansV »

That is because HTML by default ignores indentation and multiple spaces. If you want to preserve indentation in this forum, place the text between [code] and [/code] tags:

Code: Select all

/* about:home - about:newtab */
@-moz-document
  url-prefix(about:newtab),
  url-prefix(about:home) {
   .top-site-outer .tile .icon-wrapper {
     height: 100% !important;
     width: 100% !important;
   }
   .top-site-outer .default-icon,
   .top-site-outer .search-topsite {
     background-size: 100% !important;
     height: 100% !important;
     width: 100% !important;
  }
Regards,
Hans

User avatar
stuck
UraniumLounger
Posts: 7019
Joined: 25 Jan 2010, 09:09
Location: up North (but it's not that grim)

Re: Solved - Huge White Border Around Top Site Thumbnail

Post by stuck »

CraigS26 wrote:
30 Nov 2021, 12:17
...
In your Profile Chrome Folder create a New Folder — userContent.css — via the same Notepad method used for userChrome.css creation. Enter the following & Save...
If you combine that userChrome code with the code I point to in this post:
    https://eileenslounge.com/viewtopic.php ... 71#p286671
you will also be able to 'fix' the spacing on bookmarks etc.

Ken

CraigS26
2StarLounger
Posts: 141
Joined: 02 Nov 2016, 12:56

Re: Solved - Huge White Border Around Top Site Thumbnail

Post by CraigS26 »

Thanks, Hans for the Code lesson. Have always wondered How the CSS code was presented in that special "box" & Now I know.
stuck, thanks. My Bookmark Spacing was OK from prior mods.
Best to you both!
Win 10 Pro 21H2 | ESET EIS | Mbam Prem | SuperAS Pro