userChrome.css・userContent.cssスレ Part7

**名無しさん＠お腹いっぱい。** · 2017/11/11(土) 18:54:58.08

●前スレ
userChrome.css・userContent.cssスレ Part6
http://egg.2ch.net/test/read.cgi/software/1438959541/

●拡張機能
Stylish
https://addons.mozilla.org/ja/firefox/addon/stylish/
User Style Manager
https://addons.mozilla.org/ja/firefox/addon/user-style-manager/

●スクリプト
userChromeJS/UserCSSLoader at master ｷ Griever/userChromeJS
https://github.com/Griever/userChromeJS/tree/master/UserCSSLoader

●CSS（ユーザースタイルを記入するべきファイル）
userChrome.css（UI） / userContent.css（Web Site）

●関連サイト
userstyles.org
http://userstyles.org/

MDN - CSS
https://developer.mozilla.org/ja/docs/Web/CSS

とほほのスタイルシート入門
http://www.tohoho-web.com/css/

**名無しさん＠お腹いっぱい。** · 2017/11/18(土) 22:51:21.04

>>146
ローカルファイルで@importがそんなに問題になるとは思えんが
気になるなら >>147 だな
Windwosならcopyに/bオプションつければ結合できる

**名無しさん＠お腹いっぱい。** · 2017/11/18(土) 23:01:35.47

どうせなら、Web周りなんだから Node.js 環境でスマートにやろうぜ

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 01:48:48.28

>>132
これツリー型タブのサイドバーには適用されないのか…困った

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 02:04:47.58

>>150
57のツリー型タブにしたらきかなくなったよね

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 02:05:15.42

ツリー型タブの設定からcssいじれなかったけ

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 02:17:45.32

>>152
発見した
ありがとう

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 06:17:13.46

ホバーしているタブのコントロールをしたいのですが、cssでの指定はどうすればいいのでしょうか

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 10:55:08.55

Firefoxのアドレスバーと検索バーのあるバーの高さを狭くするのはどうしたらいいでしょうか？
26ptぐらいにしたいです。
いろいろやってみたのですがアドレスバーだけ狭くなってしまったりします。

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 11:26:28.77

Find in Searchbar Highlight.uc.jsで
・最初からハイライトボタンを表示
・検索ボタンの左クリックは検索実行のままにする
に変更したいのですがどこを編集すればよいのでしょうか？

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 11:30:54.67

>>141
おまかんじゃないと思う。
再起動直後は使えてもしばらくすると元の検索エンジンの検索に戻っちゃうね。

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 11:33:43.30

>>155
自分用だから好きにイジって
#urlbar,
.searchbar-textbox {
min-height: 25px !important;
margin: 0 !important;
}
#nav-bar,
#nav-bar-customization-target {
height: 25px !important;
}
#nav-bar .toolbarbutton-1 .toolbarbutton-badge-stack {
padding: 0 var(--toolbarbutton-inner-padding) !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 11:38:38.31

>>156
どこかの書き込みをメモしたものだから動くかは不明

/* 検索バーの → を常に表示するように固定 */
.search-go-button {
display: inline-block !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 12:14:50.60

大したものじゃないがメモ書き
Googleとかで丸i周辺デカくなるのがうざかった
/*-- URLバー --*/
/* |区切りと…消去 */
#pageActionSeparator,#pageActionButton{display: none !important;}
/* iの部位スリム化 */
#identity-box{
max-width: 20px !important;
padding-left: 2px !important;}
/* URLバー短く、オンマウスで広げる */
#urlbar-container{max-width: 200px !important;}
#urlbar-container:hover{max-width: 500px !important;}

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 12:22:34.42

>>159
ありがとうございます
動作はして検索ボタンは常に表示されるようにはなりましたがハイライトについては変わりありませんでした

スレ違いでしたので移動します

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 12:41:21.80

メニューバーの文字色と、タブのホバーの指定方法教えてください

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 12:45:21.72

このスレ見てるとID調べるのが死ぬほどめんどくせえってのが
存在してる一番の理由だよな

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 13:05:34.91

>>80
ブックマークを新タブで開く時にカレントタブからフォーカスを移動しない（user.js）

user_pref("browser.tabs.loadBookmarksInBackground", true);

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 13:14:41.07

>>160
全く上手く動いてなかったので手直し
/* URLバー短く、オンマウスで広げる */
#urlbar,#urlbar-container{
max-width: 200px !important;
min-width: 100px !important;}
#urlbar:hover,#urlbar-container:hover{min-width: 350px !important;}

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 14:19:12.19

urlバーを縮めて、検索バーの長さを広げたい場合は
どう記述したら良いんでしょうか

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 14:28:43.28

>>158に似たようなコードが書いてあったのでまねしてみたら形にはなりました
よく読まずに書き込んで申し訳ありません。手直し必要な部分があったら教えて下さい
/* アドレスバーの幅変更 */
#urlbar,
.searchbar-textbox {
width: 300px !important;
/* 検索バーの幅変更 */
#nav-bar,
#nav-bar-customization-target {
width: 300px !important;
}

#nav-bar .toolbarbutton-1～の部分はよく分からなかったので記述しませんでした

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 15:27:54.90

そんなものわざわざcssでやらなくても両欄の間をドラッグすればいいような

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 15:50:25.72

バーにフォルダを置く人には必要なんだよ

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 17:13:40.45

Stylishじゃサイドバーの行間とか調整できなくなった？

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 17:35:35.25

サイドバーはchrome領域だからuserChrome.cssで指定する

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 17:55:37.75

userchromeのリファレンスってどこにあるんですか？
メニューバーの色
アクティブなタブ
非アクティブでホバーされたタブ
非アクティブなタブ
をコントロールしたいですが、それぞれの書き方を知りたいです

また、waterfox55なんですが、角タブ化ってuserchromeでは無理なんでしょうか
cssの書き方はだいたいわかります

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 17:58:58.53

>>172
無い
本来ブラウザツールボックスつかってインスペクタで調べて
自力でどうにかできる人向けのものだからね

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 18:10:54.47

そういうもんなんですか
頑張ります

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 18:13:22.88

>>174
「firefox chrome url」でググると良いよ

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 18:19:40.98

ちなみに55の角タブ化ってuserchromeでは無理ですか？
ctrでは出来るんですが

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 18:27:28.63

>>176
出来るよ
自分もWaterfox使ってて角タブに変えているよ

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 18:33:39.21

コンパクトテーマじゃダメなの

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 18:49:42.64

Waterfoxスレでやれよハゲ

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 18:56:52.22

>>158
ありがとう。
#urlbar,
.searchbar-textbox
でやったらうまくいきました。

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 23:00:40.24

57ではフォントをいじれなくなったのかな？
MSPゴシック指定してるサイトはメイリオに置換してたが出来ない
游ゴシックを游ゴシックMediumにもできないしfont-weghitも効かないから辛い

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 23:19:42.50

>>181
どういう指定してるのか書かないと。
あとね。
＞font-weghit

そもそもそれ誤字なんだけど。

**名無しさん＠お腹いっぱい。** · 2017/11/19(日) 23:19:59.15

できます

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 05:35:43.66

>>181
うちもフォントの設定がおかしくなったけど試しに新規プロファイルでやってみたら普通にできたから
もしかしたらプロファイルの問題かもね

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 11:15:20.63

下記でアクティブタブに丸みがつくのですが、すべてのタブに丸みをつけるにはどう書けば良いのでしょうか？
/*** タブの角に丸み ***/
.tab-background {
border-radius: 8px 8px 0px 0px !important;
border-image: none !important;
}
.tab-line {
display: none;
}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 11:34:32.44

「font-weghit」とか書いてたらそりゃ動くわけねーわ
アホかよ

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 12:17:38.79

>>185
この間教えてもらったものです
>>186をつなげてください

/* タブの角を丸くする */
#TabsToolbar .tabs-newtab-button,
#TabsToolbar .tabbrowser-tab,
#TabsToolbar .tabbrowser-tab .tab-stack,
#TabsToolbar .tabbrowser-tab .tab-background,
#TabsToolbar .tabbrowser-tab .tab-content {
border-top-left-radius: 3px !important;
border-top-right-radius: 3px !important;
}
.tabbrowser-tab::after,
.tabbrowser-tab::before {
opacity: 0 !important;
border-image: unset !important;
border-image-slice: unset !important;
width: unset !important;
}
.tabbrowser-tab > .tab-stack > .tab-background > .tab-line[selected=true],
.tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true]) {
background-color: rgba(0,0,0,.2);
opacity: 0 !important;
}

.tabbrowser-tab .tab-background[selected=true] {
border-image: unset !important;
border-image-slice: 0 !important;
border-top:2px solid #3030E0 !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 12:18:04.30

.tabbrowser-tab::after,
.tabbrowser-tab::before {
opacity: 0 !important;
border-image: unset !important;
border-image-slice: unset !important;
width: unset !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 12:40:07.80

>>187
うーん、残念！
アクティブタブのみ丸くなり、その他間の仕切りも消えます。
>>188も繋げてます。

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 12:46:11.31

>>189
一応うちのは丸くなって入るんですが
自分はさっぱりわけわかめなので
https://i.imgur.com/xRO0eun.png

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 12:50:37.07

お世話になります　この2か所の調整できますでしょうか
https://i.imgur.com/8GzBRjf.png
よろしくお願いします

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 12:52:21.98

両方共どっかでみたことある
無理ではないと思う

**191** · 2017/11/20(月) 12:57:29.42

ありがとうございます
パンツ脱いで待ってます
どなた様かよろしくお願いします

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 13:07:00.55

サイドバーのタイトルバーをそもそも表示させないって言うのなら利用させてもらっている

/*サイドバーヘッダーを隠す*/
#sidebar-header { visibility: collapse; }

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 13:13:37.00

自分も>>185だけで全てのタブに反映されてる

**193** · 2017/11/20(月) 13:19:50.03

>>194
早速ありがとうございます。

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 13:22:36.06

>>195
俺はカレントタブだけ丸みが付いているように見えるけど、他のタブにカーソル乗せてみると
やっぱり丸み付いてるから、>>185の環境でタブと背景が同色で丸みが見えないだけだと予想

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 13:24:52.42

/* アドレスバーの幅変更 */
#urlbar,
.searchbar-textbox {
width: 300px !important;
/* 検索バーの幅変更 */
#nav-bar,
#nav-bar-customization-target {
width: 300px !important;
}

素人だけどこれのwidthをheightにしてなんかすればいいんじゃね

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 13:27:28.48

>>190
radiusが3pで丸みが見えず、仕切り線も消えてますね。

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 13:31:14.91

>>197
それはない。はっきり仕切り線も出てる。

**193** · 2017/11/20(月) 13:38:46.27

>>198
ありがとうございます　が、ダメでした

**193** · 2017/11/20(月) 13:55:49.10

とりあえず　urlバー　できました

/* urlバーの高さを変更する */
#urlbar {
font-size:12px;
min-height: 20px !important;
max-height: 20px !important;
}

https://i.imgur.com/eLfWAMX.png

>>198 ヒントどーもありがとっす

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 14:22:18.16

何だこのXPみたいな10は

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 14:23:16.53

>>202
一瞬xpかと思った凝ってるな

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 14:24:10.18

>>202
検索バーの高さも変更できたら教えて

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 14:28:35.23

正確にはxpのclassicか

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 14:29:05.06

XPというよりは2000だろ

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 14:45:57.08

履歴アイコンクリックした時に「最近閉じたタブ」一覧が折りたたまれてるんだけど
これを最初から開けるようにって出来ませんか？
userchrome関係ないかもだけど
自分はページ履歴より最近閉じたタブをよく参照してたので使いづらくなったー

**202** · 2017/11/20(月) 14:48:56.79

これを追加したらURLバーが萎みました

/* 検索バーの高さを変更する */
#searchbar {
font-size:12px;
min-height: 20px !important;
max-height: 20px !important;
}

https://i.imgur.com/4wb1hNe.png

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:00:09.30

アドレスバーの「URLまたは検索語句を入力します」って文字列消せないかな

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:05:46.20

消せるよ

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:09:19.49

>>209
Tampermonkeyのアイコンが！

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:18:07.46

これで行けるかな？

/* URLバー・検索バーの高さを変更する */
#urlbar,
.searchbar-textbox{
font-size:12px;
min-height: 20px !important;
max-height: 20px !important;
}

/* サイドバーヘッダーの高さを変更する */
#sidebar-header {
font-size: 14px;
padding: 1px 0px;
min-height: 20px !important;
max-height: 20px !important;
}

/* サイドバークローズボタン位置微調整 */
#sidebar-header .close-icon{
padding: 0 1px;
}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:20:47.47

#urlbar .textbox-input::-moz-placeholder {color: transparent !important;}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:28:03.44

>>213
いけますね

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:35:38.35

>>213
iine

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:46:53.27

/* ツールバーの高さはこれでかわった */
#nav-bar {
min-height: 10px !important;
max-height: 10px !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:53:48.74

枠の高さを変更するんじゃなく、バー自体のサイズを変えるんだな

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 15:57:33.41

こんなのも先日教えてもらいました

/*アドレスバーと検索バーの高さ */
#urlbar,
.searchbar-textbox {
min-height: 25px !important;
margin: 0 !important;
}
#nav-bar,
#nav-bar-customization-target {
height: 25px !important;
}
#nav-bar .toolbarbutton-1 .toolbarbutton-badge-stack {
padding: 0 var(--toolbarbutton-inner-padding) !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 16:06:57.54

俺もこの前別のスレで教えてもらったブックマークツールバーがにょきにょき隠れるやつ
/*Auto Hide book mark bar*/

treechildren::-moz-tree-twisty {
-moz-appearance: none !important;
padding-right: 0px !important;
padding-top: 0px !important;
width: 0px !important;
list-style-image: none !important; }
#navigator-toolbox
{
position: relative;
transition: all 0.3s ease 0s !important;
}
#PersonalToolbar
{
/*overflow: hidden;*/
margin-top: -20px !important;
transition: all 0.3s ease 0s !important;
}
#navigator-toolbox:hover
{
margin-bottom: -20px !important;
transition-delay: 0s !important;
}
#navigator-toolbox:hover > #PersonalToolbar
{
margin-top: 0 !important;
transition-delay: 0s !important;
}

**202** · 2017/11/20(月) 16:11:43.92

>>213
すげぇ～！！！　パンツ脱いだ甲斐があった～！！！
どうもありがとうございます。m(__)m
今日はフルチンで過ごしますね。

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 16:17:44.03

>>220
ぬるぬるだな
サイドバーもこのくらい自動でぬるぬる隠れないかな

**202** · 2017/11/20(月) 16:21:10.65

と思ったらサイドバーちょっと変です
https://i.imgur.com/0w99a5i.png

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 16:36:44.50

>>223
これで大丈夫だと思う。
後、フォントサイズ13pxにした方が見栄え良くなるかも。

#sidebar-header {
font-size: 13px !important;
padding: 1px 0px !important;
min-height: 20px !important;
max-height: 20px !important;
}

#sidebar-header .close-icon{
padding: 0 1px !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 16:39:13.94

>>185
https://i.imgur.com/hsQvh6u.png
上2段は>>185のみ、2段目はホバーしているタブに丸みがあるが区切りが消えるのがわかる
下段はこれを踏まえて追記をしたcss
テーマはデフォルト

/*** タブの角に丸み ***/
/* タブ自体を丸くする */
.tabbrowser-tab,
/* タブの背景を丸くする */
.tab-background {
border-radius: 8px 8px 0px 0px !important;border-image: none !important;
}
/* 青ライン(を含む四角形のイメージだが) */
.tab-line {display: none;}
/* 各タブ時の区切り線を消す radius大きくすると上にはみ出る縦線 */
.tabbrowser-tab::before,.tabbrowser-tab::after {opacity: 0 !important;border-image:none !important;border-image-slice: unset !important;width: unset !important;}
/* タブの区切り線色は適宜変えてどうぞ */
.tabbrowser-tab {
border-left: 1px solid #FF0000 !important;
border-top: 1px solid #FFFF00 !important;
border-right: 1px solid #00FF00 !important;
}
/* 青ラインの替り不要なら消してok */
.tab-background[selected] {
border-top: 2px solid #0000FF !important;
border-right:none !important;
border-left:none !important;
}

**223** · 2017/11/20(月) 16:39:33.01

>>224
完璧です！！！
ほんとにありがとうございました

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 18:16:41.26

タブの色のcssを観たいのですが、インスペクタからだとわかりません
動やったらわかりますか？
解説しているサイトないでしょうか

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 18:37:18.46

ブラウザツールボックスから

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 18:51:48.48

>>227
ブラウザツールボックスのインスペクタータブの左のボタンを押せ
後は調べたい場所にマウスポインタを合わせるか、インスペクターで調べる

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 19:43:48.97

こんな感じ
http://up.mugitya.com/img/Lv.1_up113741.png

ウエブ開発→ページのソースで
view-source:chrome://browser/content/browser.xul

chrome://browser/content/browser.cssも参考になる

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 19:49:12.77

CSSでメニューバーにツールバーを表示出来ませんか？

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 20:06:47.72

リンクを右クリックしたときにでるリンクをPocketに保存や
リンクを端末へ送信を消したいんですけどどう書けばいいのでしょうか
画像を右クリックしたときにでるものも同じように消したいです

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 20:09:41.52

ツールバー？(urlバーや三ボタンがあるバー)の高さや余白は、どう指定すればいいでしょうか？
Defaultのテーマだと上下に無駄な部分が多いので減らしたいです

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 20:16:32.37

>>232
Pocket を使わないなら about:config で extensions.pocket.enabled を false で止められる

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 20:48:42.41

>>233
せめてスレ内検索してから聞いて

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 20:59:56.87

>>235
>>217のことですか？
それならやってみたのですが上手くいきませんでした
デフォルトテーマでのurlバーの上下に出来てるスペースを無くしたいのですが
paddingでもmarginでも変化がなくてお手上げです

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 21:07:53.28

>>230
横からだけどありがとう
数日悩んでたオプションページplaceholder のフォントができた
window内はuserContentなんだな

**237** · 2017/11/20(月) 21:27:21.45

X　フォントができた
◎　フォントが変更できただ

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 21:27:40.73

>>232
/* リンクを端末へ送信 */
#context-sendlinktodevice{
display:none !important;
}

**233** · 2017/11/20(月) 21:43:06.43

自己解決出来ました

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 21:56:59.09

urlバーに表示される「リーダービューで開く」「ページ操作」など、
chrome://browser/content/browser.xul　では表示されないような要素は
どうやって調べているのでしょうか？

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 22:12:35.94

>>234 >>239
ありがとうございます

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 22:29:07.69

>>241
ブラウザーツールボックス

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 22:30:40.34

>>242
/* リンクを送信、リンクURLをメールで送信、画像をメールで送信削除 */
#context-sendlink,
#context-sendpage,
#context-sendimage {
display: none !important;
}

/*ページを端末に送る削除 */
#context-sendpagetodevice { display: none !important; }
#context-sep-sendpagetodevice { display: none !important; }

**名無しさん＠お腹いっぱい。** · 2017/11/20(月) 22:36:00.87

>>241
1.F12キーを押す→右上の歯車ボタンを押す→右下の2つの「○○デバッガーを有効化」をON
2.ctrl+shift+alt+iキーを押してブラウザーツールボックスを開く
　（リモートデバッグ接続要求がでるのでOKボタンを押す）
3.ブラウザーツールボックスの左上の「ページから要素を選択します」ボタンを押す
4.Firefoxのウィンドウで目的の要素をクリック
5.全部調べ終わったら1.でONにしたのをOFFにする

ページ操作ボタンをクリックしたときのようにポップアップした要素を調べたいときは
ブラウザーツールボックスの右上の「ポップアップが自動的に隠れないようにします」ボタンを押してから
ポップアップさせた後に3.～4.をするといいよ

**213** · 2017/11/20(月) 23:09:06.25

ちょっとズレてたんで微調整とアイコンコンパクト化

/* URLバー・検索バーの高さを変更する */
#urlbar,
.searchbar-textbox {
font-size:13px;
min-height: 20px !important;
max-height: 20px !important;
}

[uidensity="compact"]:root #urlbar,
[uidensity="compact"]:root .searchbar-textbox {
margin-top: 2px !important;
margin-bottom: 2px !important;
}

#reload-button > .toolbarbutton-animatable-box,
#stop-button > .toolbarbutton-animatable-box {
padding: 0 1px !important;
margin: 0px !important;
}

**213** · 2017/11/20(月) 23:10:19.91

/* ツールバーアイコンコンパクト化 */
#identity-icon,
.searchbar-search-icon {
width: 14px !important;
height: 14px !important;
}

#nav-bar .toolbarbutton-1 > .toolbarbutton-icon,
#nav-bar .toolbarbutton-1 .toolbarbutton-badge-stack {
padding: 2px !important;
margin: 0px !important;
width: 20px !important;
height: 20px !important;
}

[uidensity="compact"]:root .urlbar-icon {
width: 20px !important;
height: 22px !important;
padding: 2px !important;
}

#pocket-button-box[animate="true"] > #pocket-animatable-box {
margin: 0px !important;
}

#urlbar, .searchbar-textbox {
margin: 0 3px !important;
}