June 7, 2017

Firefoxのロケーションバーが長すぎる

環境にもよると思うけど、Firefoxのロケーションバー(アドレスバー)の幅が広すぎて、検索バーが圧迫されてしまうことがある。もちろん境界をドラッグすれば調整は可能だが、限度があり、その限度値が不適切。

要するに、ロケーションバーのmin-widthが大きすぎるってこと。

userChrome.css

userChrome.cssでカスタマイズできる。場所は以下(無ければ作る)。

# Linux
~/.mozilla/firefox/XXXYYZZ.default/chrome/userChrome.css
# Windows
%USERPROFILE%\Application Data\Mozilla\Firefox\Profiles\XXXYYZZ.default\chrome\userChrome.css

XXXYYZZの部分は、人それぞれ。

中身はcssなので、ある程度は想像つく。

/*
 * http://www-archive.mozilla.org/unix/customizing.html
 */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* Dropdown button for search bar */
#searchbar .autocomplete-history-dropmarker {
    display: -moz-box !important;
    -moz-binding: url("chrome://global/content/bindings/autocomplete.xml#history-dropmarker");
    -moz-appearance: toolbarbutton-dropdown !important;
}

/* Hide dropdown button on folders in bookmark bar */
#personal-bookmarks .bookmark-item[container] > .toolbarbutton-menu-dropmarker {
    display: none !important;
}

/* Bookmark icon */
.bookmark-item[label="Git"] image {
    width: 0 !important;
    height: 0 !important;
    padding: 0 0 16px 16px !important;
    background: url("https://github.com/git/git-scm.com/raw/master/public/favicon.ico")!important;
}

/* Font */
window {
    font-family: "Droid Serif", Century, serif !important;
}
#urlbar-container {
    font-family: Consolas !important;
}
menu.bookmark-item,
menuitem.bookmark-item {
    font-family: "Droid Serif", Century, serif !important;
}

/* Width for address bar and search bar */
#urlbar-container {
    min-width: 200px !important;
}
#search-container {
    min-width: 200px !important;
}

ネタ元はここ

徹底的に理解するならここ

Tags: firefox