본 사이트는 여러분의 사용자 경험을 개선하기 위해 유지 보수를 진행하는 동안 기능이 제한됩니다. 도움말로 문제가 해결되지 않고 질문을 하고 싶다면 Twitter의 @FirefoxSupport 및 Reddit의 /r/firefox 채널을 활용하세요.

Mozilla 도움말 검색

고객 지원 사기를 피하세요. 저희는 여러분께 절대로 전화를 걸거나 문자를 보내거나 개인 정보를 공유하도록 요청하지 않습니다. "악용 사례 신고"옵션을 사용하여 의심스러운 활동을 신고해 주세요.

자세히 살펴보기

Shrink vertical space between shortcut icons on new tab page

  • 3 답장
  • 0 이 문제를 만남
  • 최종 답변자: cor-el

more options

How to shrink this vertical space? (see attached image)

Ever since 131.0.0 my shortcut icons got all messed up so I am trying to restore the original look. I've already removed the giant Firefox logo and made my icons larger. Now I need to condense them so I don't have to scroll to see them all.

Here's what I have so far in my userContent.css:

/* Minimize the size of the logo and wordmark on the Home/New Tab pages */ @-moz-document url(about:newtab), url(about:home) {

 .logo {
   background-size: 0px !important;
   height: 0px !important;
   width: 0px !important;
 }
 .wordmark {
   background-size: 0px !important;
   height: 0px !important;
   width: 0px !important;
   margin-inline-start: 0px !important;
 }
 /* Expand the shortcut icon images to max size on the Home/New Tab pages */
 .top-site-outer .tile .icon-wrapper {height:100% !important; width:100% !important;}

}

How to shrink this vertical space? (see attached image) Ever since 131.0.0 my shortcut icons got all messed up so I am trying to restore the original look. I've already removed the giant Firefox logo and made my icons larger. Now I need to condense them so I don't have to scroll to see them all. Here's what I have so far in my userContent.css: /* Minimize the size of the logo and wordmark on the Home/New Tab pages */ @-moz-document url(about:newtab), url(about:home) { .logo { background-size: 0px !important; height: 0px !important; width: 0px !important; } .wordmark { background-size: 0px !important; height: 0px !important; width: 0px !important; margin-inline-start: 0px !important; } /* Expand the shortcut icon images to max size on the Home/New Tab pages */ .top-site-outer .tile .icon-wrapper {height:100% !important; width:100% !important;} }
첨부된 스크린샷

선택된 해결법

This code might be better

@-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;
  }
  .top-site-outer .search-topsite {
     height: 20px !important;
     width: 20px !important;
  }

 .top-site-outer .top-site-inner > a {padding-block: 8px 0px !important}
 .top-site-outer {margin-block-end: 0px !important}
}

문맥에 따라 이 답변을 읽어주세요 👍 1

모든 댓글 (3)

more options

Irreverent post made in error.

글쓴이 ThePillenwerfer 수정일시

도움이 되셨습니까?

more options

Note that there is a pref in about:config to show/hide the logo.

  • browser.newtabpage.activity-stream.logowordmark.alwaysVisible

Try this CSS code in userContent.css.

.top-site-outer .top-site-inner > a {padding-block: 4px !important}
.top-site-outer {margin-block-end: 0px !important}

도움이 되셨습니까?

more options

선택된 해결법

This code might be better

@-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;
  }
  .top-site-outer .search-topsite {
     height: 20px !important;
     width: 20px !important;
  }

 .top-site-outer .top-site-inner > a {padding-block: 8px 0px !important}
 .top-site-outer {margin-block-end: 0px !important}
}

도움이 되셨습니까?

질문하기

글에 답글을 달기 위해서는 계정으로 로그인해야만 합니다. 계정이 아직 없다면 새로운 질문을 올려주세요.