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/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;
}

**223** · 2017/11/20(月) 23:24:43.89

>>247
シャープでスッキリですね
アフターケアありがとうございます。

**237** · 2017/11/21(火) 00:06:18.72

'Classic' css tweaks for Firefox 57+ って毎日のようにアップデートされてるんだな
古いのはさっさと捨てていかないとわけわからなくなってくるわ

**213** · 2017/11/21(火) 00:42:48.14

度々申し訳ない、スターアイコンがズレてたんでこれも追加で。

/* スターアイコン押下時位置調整 */
[uidensity="compact"]:root #star-button-box[animationsenabled] > #star-button[starred][animate] + #star-button-animatable-box {
margin-inline-start: -6.5px !important;
}

#star-button-box[animationsenabled] > #star-button[starred][animate] + #star-button-animatable-box {
top: calc(50% - 17px) !important;
margin-inline-start: -6.5px !important;
}

**248** · 2017/11/21(火) 01:01:20.34

>>250
お疲れ様　遅くまでありがとうございますｗ

ポータブル版で試してるんですけど
★ ブックマークが32bitだと黒文字、64bitだとグレーなんです。
userChrome.js用スクリプトその1
http://wiki.nothing.sh/page/userChrome.js%CD%D1%A5%B9%A5%AF%A5%EA%A5%D7%A5%C8
32bitフォルダ、64bitフォルダに同じように設定したのですがfirefox側の問題なんですかね？

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 01:02:20.37

<menuseparator generateditemid="0"/>
とかいう謎の記述があるんだけどどうやって指定すんだこれ
消せねえ

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 01:04:55.73

"0"/<ﾋｬｯﾎｰ

**241** · 2017/11/21(火) 01:11:56.62

>>245
大変丁寧な説明をありがとうございました。
普段ここのログなどを参考に少しずついじっていたのですが、自分で色々調べられる事が増えそうです。

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 03:58:42.33

ページ内検索バーを使って検索し終わった後バーからターゲットが外れたら閉じるようにするには
どうすればいいですか？

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 05:38:55.69

dreams of wavesというテーマを使っているのですが
メニューバーの枠を消すことは出来ないでしょうか？

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

>>252
隣接セレクタ

直前のアイテム + menuseparator[generateditemid]

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 07:52:56.00

タブのアニメーションをoff

.tab-throbber { visibility: hidden !important; }
.tabbrowser-tab .tab-loading-burst { display: none !important;}

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 08:36:05.82

これはいい㌧

**251** · 2017/11/21(火) 08:40:28.51

>>250
お早うございます。
win10 64bitのシステムフォントを
Yu Gothic UI 9pt から Meiryo UI 9pt にしたら
黒文字になりました　m(__)m

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 10:05:53.27

>>247
メニューバーの最小化、最大化、閉じるのアイコンの大きさも
このように調整することは出来るの？
メニューバーの高さを22pxにしたら先述のアイコンがちょっと
不自然に大きくなっちゃってるんだけど。

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 10:08:12.42

>>255
似たような動作するのがあったけどうまく動かなかったんで
どこにあったのかも忘れた
とりあえず便利と思えるのを四つ紹介
googleで検索すれば見つかります
toggle-findbar.uc.xul
global_FindTerm.uc.js
Find in Searchbar Highlight.uc.js
ページ内検索バーをChrome風にする.css - お豆腐

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 13:02:40.54

拡張スレで質問したらスレチと言われたので
こっちで質問します。

アドレスバーの「URLまたは検索語句を入力します」と検索バーの「検索」
この文字、cssでフォーカス当てた時に消すこと出来ない？

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 14:06:29.89

Findbarを上部に表示させたいのですがどうすればいいのでしょうか
56まではこのCSSで問題なかったのですが57にアップデートしたら効かなくなってしまいました

/*Findbarを上部へ*/
.browserStack { -moz-box-ordinal-group: 2; }
statuspanel { -moz-box-ordinal-group: 3; }
findbar { -moz-box-ordinal-group: 1; }

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 14:17:27.98

>>264
ttp://tofukko.blog113.fc2.com/?cat=1

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 14:42:40.21

>>261
これでメニューバー（ついでにタブバー）に置いたアイコンも小さくなるけど、
最小化、最大化、閉じるはOSのテーマ変えないと無理かも。

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

微調整とおまけのもっとコンパクト化。
/* URL・検索バーのGOボタン少し調整 */
.urlbar-go-button,
.search-go-button {
max-width: 14px !important;
}

/* アイコン幅調整 */
#nav-bar,
toolbar .toolbarbutton-1 {
padding: 0px !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 14:56:37.88

>>264-265
これいいねもうすこし細いとなおいいけどね

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 15:03:20.14

>>265
ありがとうございます
ただ私の環境では変化無しでした
何か設定がまちがってるのかな

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 15:08:19.24

>>263
#urlbar ::placeholder, #searchbar ::placeholder { opacity: 0; }

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 15:09:40.17

>>263
.textbox-input:focus::placeholder {
color: transparent;
}

これでいけるかと

**269** · 2017/11/21(火) 15:10:50.60

間違えた
#urlbar :focus::placeholder, #searchbar :focus::placeholder { opacity: 0; }

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 15:14:10.44

>>270
因みに、この指定だとブックマークの検索のプレースホルダも消えるよ

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

>>268
うちは "その1" で動いてます

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 16:11:40.34

クレクレ君でごめん
findbarを上にするだけでなく、右側に寄せるのをお願いしたい

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 16:16:01.37

>>274
つ>>265

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 16:16:30.18

>>274
>>265ので右になるとおもうけど

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 16:17:13.88

>>269-270
サンクスです

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 16:25:53.14

自己解決というか、検索したら見つかった
58.0b4で確かめた

http://tofukko.blog113.fc2.com/?cat=1

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 16:27:28.37

>>278
荒らし？

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 16:56:49.78

userchrome.css でアドオンのポップアップ内のスタイルを指定する方法はありますか
あれば教えていただきたいです

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 18:13:26.59

タブのcss調べたらtab-background-middleというクラスが使われていたのですが、以下のようにしても角丸が解除されません
.tab-background-middle{background:red !important;
border-radius:0px !important;}
角丸はどこで設定されているんでしょうか？もしかしたらborder-radiusではないのかもしれませんが

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 18:36:12.23

>>281
うん、border-radiusじゃないね
非アクティブタブのマウスオン時は.tab-backgroundと.tabs-newtab-button、
アクティブタブは.tab-background-startと.tab-background-endのbackground-imageだよ

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 19:32:38.34

>>262
違うけどありがとう　お豆腐は使わせてもらいます

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 21:24:37.04

>>264,268ですが表示できない原因が判りました
新規でuserChrome.cssを作って>>265を設定したところ反映されたので
今までの設定を戻していくと↓の定義を追加するとダメでした
うまく共存できる方法はないかな

/*ブックマークフォルダの色を黄色に戻す*/
@-moz-document url(chrome://browser/content/bookmarks/bookmarksPanel.xul) {
treechildren::-moz-tree-image(title, container),
treechildren::-moz-tree-image(title, open) {
list-style-image: url("chrome://global/skin/icons/folder-item.png")!important;
-moz-image-region: rect(0px, 32px, 16px, 16px)!important
}

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 21:29:37.33

アドオンツールの「今すぐ更新を確認」とかが消せない
#utils-updateNow { display: none !important; }
では駄目だった．．．orz

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 21:40:02.31

何でやってんの

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 22:18:59.75

>>38
面白いから他のPCにも導入したら、カラーで表示されないでなぜか白黒?!

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 22:28:48.79

>>287
osがカラーフォントに対応してないからだろう

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 22:35:38.99

>>38
1F354の部分を変更でいろいろ
https://archiveofourown.org/works/6580324/chapters/15057844

**名無しさん＠お腹いっぱい。** · 2017/11/21(火) 23:31:30.25

上の方に書いてあった検索バーの幅変更が上手くいかない
正常に動いたコードあれば教えてください

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 00:29:00.62

>>266
ありがとう。そこはOSの制限なんですね。

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 00:33:19.97

>>290
コードじゃないけどアドレスバーと検索バーを隣り合わせて
カスタマイズ完了直後にアドレスバーの右側へカーソルを持っていけば
矢印が出てきてアドレスバーと検索バーの長さを同時に調節できる。

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 00:36:44.13

こんな期機能があったのか・・・
ありがとうございます　助かりました

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 00:50:13.52

質問スレッドに記載させていただいたのですが、回答つかないようなので、こちらで質問させてください。

http://egg.5ch.net/test/read.cgi/software/1510776194/400
の方法で、タブをウィンドウの一番下に置いたのですが、
タブの数が少ない時は正常に動くのですが、
タブが多くなってきて、タブを左右にスクロールさせるボタンが出てくると
タブが全体的に下にずれてしまいます。

ブラウザツールボックスで見ていると
<tabs id="tabbrowser-tabs" class="tabbrowser-tabs" tabbrowser="content" に
overflow="true"が入ると、
タブ部分が3px分下にずれてしまいます。
途中でブラウザツールボックスが起動しなくなってしまいましたので、正確な位置はわかりませんが
class="arrowscrollbox-scrollbox"より上位
（強制的にこのclassをtransformで3px上に移動させても両端のスクロールボタンは下にずれていたので）
で、 class="tabbrowser-tabs"の間で何か設定されていると思っています。
（class="tabbrowser-tabs"をtransformで3px上に移動させても
今度は、タブが少ない時（タブを左右にスクロールさせるボタンがでない時）は、
上にずれてしまいます。

おそらく、overflow="true"になった時だけ、上にずらせば良いと思うのですが、
これはどの様にuserChrome.cssに書いたら良いのでしょうか？

すいませんが、どなたかご教示をお願いいたします

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 03:42:26.74

http://wiki.nothing.sh/page/userChrome.js%CD%D1%A5%B9%A5%AF%A5%EA%A5%D7%A5%C8#wd355e7f
今って↑のuserChrome.js導入.zipに従えば間違いない？
同梱されてるやつすら動かせないんだけど
他どっか弄ってたら動かないとか何かある？

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 03:49:14.74

スレチです

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 05:26:29.06

>>282
何を指定すれば角丸無効になりますか？

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 08:19:30.41

>>273
横からですみません
その1とは、何をさしているのでしょうか？

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 08:37:04.31

ステータスバーって表示できない？

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 09:03:47.04

>>297
昔のFirefoxはタブの角をcssで触れてたが、
今はタブのイメージ画像で作られてるので無理

>>298
一番最初にある57対応のcss

>>299
無理

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 09:21:36.97

>>300
画像無効にしても効かないです
userchromeではどうにもできないんでしょうか

ctrでは角タブになるし、デフォルトのテーマでも角タブになります

何かで設定出来るということですよね？

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 09:22:40.08

>>298
userChrome.js用スクリプトその1
http://wiki.nothing.sh/page/userChrome.js%CD%D1%A5%B9%A5%AF%A5%EA%A5%D7%A5%C8#jbabc5f7

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 10:24:44.11

>>284
ブックマークフォルダのスタイル末尾に } が一個足りないけどそのせいでは?

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 10:28:46.56

>>285
アドオンマネージャーは userChrome.css ではなく userContent.css
可能性は低いけどウェブページに誤爆しないとも限らないので @-moz-document 規則使った方がいい

/* アドオンマネージャー */
@-moz-document url("about:addons") {
/* "今すぐ更新を確認" */
#utils-updateNow { display: none !important }
}

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 11:26:53.25

ブックマークレットにfavicon設定したいけどなんか手はないものか
フォルダは設定出来るのになあ

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 12:04:04.38

Firefox57.0 (64 ビット) です
メニューバー　アドレスバー　検索バー
ブックマークツールバー
タブ
にしたいのですがuserChrome.cssの記述を教えてください。
よろしくお願いします。

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 12:08:10.89

このスレ探せばあったはずだぞ

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 12:28:29.35

>>300
>>302
レスありがとうございます。意味が理解出来ました。

**285** · 2017/11/22(水) 12:39:25.89

>>304
消せた thx
名無しセパは #utils-debugAddons+menuseparator でおｋだった

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 12:41:32.26

ブックマークツールバーの背景色を変えることはできますか？

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 12:41:51.47

userChrome.cssにこれを設定しても黄色くならないのは
何がダメなんだろう？
他の変更（アドレスバーとタブの位置変更）は上手く行ったのに
保存はMeryで行っているのに

> /*ブックマークフォルダの色を黄色に戻す*/
> @-moz-document url(chrome://browser/content/bookmarks/bookmarksPanel.xul) {
> treechildren::-moz-tree-image(title, container),
> treechildren::-moz-tree-image(title, open) {
> list-style-image: url("chrome://global/skin/icons/folder-item.png")!important;
> -moz-image-region: rect(0px, 32px, 16px, 16px)!important
> }

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 12:49:28.81

上に答え書いてくれてる人いるぞ

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 13:42:50.88

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 14:16:28.21

https://i.imgur.com/41tSsGi.jpg
userchromeをインスペクタから調べているのですが、
.tab-background-middleという要素に何らかの角丸が使われているようです
とりあえずbackground-image:none !important;で画像を無効にしたのですが、角丸画像が消えません
どうしたら良いでしょうか

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

>>294
#tabbrowser-tabs[overflow="true”]{

}
状況がいまいちわかんないけど、これに書いてみて

CSSのセレクタとかちょっと勉強した方が良い(弾かれるから短縮)
https://goo.gl/9qLSM1

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 15:35:52.83

>>314
.tab-background-middleにこだわるのやめな

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 15:42:22.76

>>314
.tab-background-start[selected=true]::after,
.tab-background-start[selected=true]::before,
.tab-background-start,
.tab-background-end,
.tab-background-end[selected=true]::after,
.tab-background-end[selected=true]::before {
display: none;
}

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 15:42:47.11

>>312
>>313
ありがとう～最後に一個　足りなかったんですね。
上手くいきました。

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 15:46:37.68

57になって、サイドバーのヘッダー部分が縦に大きく目立つようになったので、少しスリムにしました。
おすそ分けします。

/* サイドバーヘッダーのスリム化 Firefox57 */
.sidebar-header,
#sidebar-header {
font-size: 1em !important;
padding: 0px !important;
}

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 16:02:46.62

>>280
自己解決できました
usercontent.css
@-moz-document url("moz-extension://b7a72b10-f1c2-4bef-9312-b3f448dec6ef/popup.html") {}

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 16:08:18.51

>>305
ブックマークツールバーに置いたブックマークレットは出来ている

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 16:32:47.18

>>319
ありがとん

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 16:53:12.60

>>320
そのURLのID部分は拡張で固定ではなく、他のプロファイルや拡張一旦アンインストールすると変わっちゃうので要注意ね

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 18:05:32.69

>>317
このcss適用しても文字がタブの表示が狂うのはどうしてでしょうか

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 18:10:47.12

>>324
Lightweight Square Tabs | Userstyles.org
https://userstyles.org/styles/140263/lightweight-square-tabs

Show CSS Codeのボタンを押してcssを参考に自分用にカスタマイズ

**237** · 2017/11/22(水) 18:47:31.73

>>294
Custom CSS tweaks for Firefox 57+に
tabs_below_main_content.cssってのがあるからこれ見て参考にしてみたら？

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 19:07:46.10

>>315
ありがとうございます。
こういう指定をすればいいのですね。
無事動かすことが出来ました。

しかも、教材まで紹介していただき、誠にありがとうございます。
CSSを弄ったことがないので、人のを見ながらなんとか弄っていたので、大変助かります。
早速勉強させていただきます。
ありがとうございましたm(__)m

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 19:21:17.69

>>326
ありがとうございます。
早速、見てきました。
私のCSSと違って非常にシンプルですね。
特に上下にすれていないみたいですし、私が何か余計な処理をしているみたいですね。

中身を1個ずつ追いながら、勉強させていただきます。
ありがとうございましたm(__)m

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 19:50:33.71

57からタブのローディング中のアイコンが右左に動くのが嫌で
56以前のローディングアイコンに戻すcss探してたらあったから
おすそわけでサイト貼っとくね。

https://www.reddit.com/r/FirefoxCSS/comments/71vbds/revert_the_tab_throbber_in_firefox_57/

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 20:04:28.92

>>329
ありが㌧

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

>>329
最高ありがとう

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 20:17:57.12

>>305
55以降のブックマークの既定のファビコンはCSS(list-style-imageプロパティ)ではなく
image要素の描画(src属性指定)になっているみたいだ

ということでこんな感じ
(リンク先の例はHTMLのimg要素なのでdisplayとか色々付いてるけど、image要素には必要なさげ)

/*
* ブックマークレットのアイコンを設定する (Firefox 55+ 対応)
*
* 参考: Replace the Image in an <img> with CSS | CSS-Tricks
* https://css-tricks.com/replace-the-image-in-an-img-with-css/
*/
@-moz-document url("chrome://browser/content/browser.xul") {
:root {
--my-favicon-size: 16px;
}
/* Bookmarklets */
.bookmark-item[scheme="javascript"] image {
background: url("chrome://branding/content/icon32.png") center/var(--my-favicon-size) no-repeat !important;
padding-left: var(--my-favicon-size) !important;
}
}

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 20:21:05.67

>>323
ありがとうございます。

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 20:26:45.81

>>332
いただきました。

**名無しさん＠お腹いっぱい。** · 2017/11/22(水) 20:35:52.18

>>329
こういう状態が複数あるのは調べるの面倒なんだよね
ありがたくいただきました
しかしなんでこんな左右に動くへんなのにしたんだか