Mozilla会系Firefox組コミュのmixiのニューデザインに発狂！（対応策）

FireFoxとは関係ないですが、mixi専用ブラウザを使うと簡単に解消したり。
http://nekomimi.la.coocan.jp/lzh/mixicat.htm

とりあえず自分も一区切りですね、今は右側のレイアウトで落ち着いてます。

左のレイアウトでも良かったんですが、
右カラムがはみ出たり左カラムのmixiニュース右手に空白が出来たり
ちょいと落ち着かない感じなんで右のレイアウトに変更しました。

元々トップページが下に長いのが不満だったので、
とにかくシンプルに元のレイアウトに近づけました。
1024*768の環境でほんの少しスクロールするだけで全部見えるので、
1280*1024の環境ならスクロールすらいらないかも。

こんにちは、何もしてないここの管理人です。

別に今回のデザイン変更に文句があるわけではありませんが、Stylishの広告非表示バージョンを入れたついでに、ちょっと書き足してロゴをとったりメニューを常に上に固定するバージョンにしてみました。
レイアウトは大きく変わるわけではありませんが、メニューがついて回るので、長い日記とか読むことが多い人には便利かもしれません。

CSSは下記のブログのコメント欄2番目のものです。
http://blog.gaspanik.com/articles/394/stylish-for-mixi-renewal

みなさん流石ですねぇ．
ワタシはもう何年もHTMLやCSSを触ってないのですっかり忘れてしまいました...
皆さんのコメントを参考に変えさせて頂きました．ありがとうございます．

結局，基本機能はそのままにしたかったので，広告削除と背景色変更だけですが．
あと，フォントを変えてみました．
ミクシィには手書き風のフォントが似合うかなぁ，と思い，半角英数を「Comic Sans MS」，全角を「あくあＰフォント」で．デザインの崩れもありません．
「あくあフォント」はフリーのフォントです．

・あくあフォント
　http://aquablue.milkcafe.to/
　（Mac用もあります．）

なんだか行間も間延びした感じなので line-height: をガシガシ入れてます。
あとは… display: none; も。

display: none; は…
#bodyMainArea div.sponsorList01 とか…
#bodyMainArea div.sponsorList02 とか…
#bodyMainArea div.messageAreaAd とか…
#completion_dialog div.finishAd とか…
#oldContents div.prContents とか…
#diaryComment div.diaryBottomAd とか…


あくまでも「自己責任」において…。

　ここで紹介されている方法を色々組み合わせてみたら、何故か日記のレス1つめだけがレイアウトずれるんです……。

@charset "utf-8";
@-moz-document domain("mixi.jp") {


#headerArea {
width:725px !important;
background:transparent !important;
height:auto !important;
}
h1 { display:none !important }
#bodySub { display:none !important }
p.adBanner { display:none !important }


#globalNavigation {
width:auto !important;
height:18px !important;
margin-left:5px !important;
padding:0 20px 0 20px !important;
border:2px dotted #FFCC66 !important;
}
ul.contentsNavigation { background:transparent !important }
ul.utilityNavigation { background:transparent !important }
#globalNavigation li {margin:0 8px !important }
#globalNavigation ul.contentsNavigation li.home a:before {
content: "Home" !important;
}
#globalNavigation ul.contentsNavigation li.home a img { display:none !important }
#globalNavigation ul.contentsNavigation li.news a:before {
content: "News" !important;
}
#globalNavigation ul.contentsNavigation li.news a img { display:none !important }
#globalNavigation ul.contentsNavigation li.friendInvite a:before {
content: "FriendInvite" !important;
}
#globalNavigation ul.contentsNavigation li.friendInvite a img{ display:none !important }
#globalNavigation ul.utilityNavigation li.help a:before {
content: "Help" !important;
}
#globalNavigation ul.utilityNavigation li.help a img { display:none !important }
#globalNavigation ul.utilityNavigation li.logout a:before {
content: "Logout" !important;
}
#globalNavigation ul.utilityNavigation li.logout a img{ display:none !important }

#globalNavigation ul.contentsNavigation li.diary { display:none !important }
#globalNavigation ul.contentsNavigation li.community { display:none !important }
#globalNavigation ul.contentsNavigation li.movie { display:none !important }
#globalNavigation ul.contentsNavigation li.photo { display:none !important }
#globalNavigation ul.contentsNavigation li.music { display:none !important }
#globalNavigation ul.contentsNavigation li.review { display:none !important }
#globalNavigation ul.contentsNavigation li.mikly { display:none !important }
#globalNavigation ul.contentsNavigation li.friendSearch { display:none !important }


#localNavigation {
width:auto !important;
position: absolute;
top: 22px;
margin-left:5px !important;
}
#localNavigation ul.localNaviHome li.review { display:none !important }
#localNavigation ul.localNaviHome li.music { display:none !important }
#diaryPullDownButton { display:none !important }
#videoPullDownButton { display:none !important }
#photoPullDownButton { display:none !important }
#localNavigation ul.localNaviFriend li.mymixi { display:none !important }
#localNavigation ul.localNaviFriend li.review { display:none !important }
#localNavigation ul.localNaviCommunity li.review { display:none !important }


div.searchForm01 { display:none !important }
#bodyMainArea { margin-top:5px !important }

#bodyArea { width:725px !important }
#newMyDiary { display:none !important }
.iconListTable { display:none !important }
.statusIcon { display:none !important }
.heading01 { display:none !important }
.utilityLinks03 { display:none !important }


#footerArea { width:725px !important }
.pagetop { display:none !important }
.footerNavigation01 { display:none !important }
.sponsorList01 { display:none !important }
.diaryBottomAd { display:none !important }
.finishAd { display:none !important;}
.messageAreaAd { display:none !important }
#footprintjack { display:none !important }
#footprintjack02 { display:none !important }
.prContents { display:none !important }
#help { display:none !important }
#intro { display:none !important }
}

　何がおかしいんだろう(-x-;)

>>68
コレ入れたらどうなります?

/* 日記の一つ目のコメントのdl要素のズレを修正。 */
div.diaryMainArea02 { clear: both; }

/* コミュニティのトピックの一つ目のコメントのズレを修正。 */
dl.commentList01 { clear: both; }

/* コミュニティのトピックのタイトルのズレを修正。 */
dl.bbsList01 { clear: both; }

こ〜いち様＞
　おおおお、完璧に治りました！　有難う御座います。多謝。

「トピックコメント作成」の書き込み内容最終確認で表示される　「写真」のブロックが
異様に間延び(行が開きすぎている)ので、つめようとしているのですが、思うように
つまってくれません。

#editList01 div.contents ul.editContents ,
#editList01 div.contents ul.editContents dd ,
#editList01 div.contents ul.editContents dl.photoUpload { line-height: 1.1 !important; }

と、いろいろやっているのですが…
もしかして、id , classの指定が間違っているのか、構文自体を間違えているのか…

>>71: こ〜いち さん
#bodyArea dl.photoUpload{margin-top:1px !important; padding-bottom:1px !important;}
とか書くと、変わってきますよ。

DOM InspectorでDocument - DOM NodesとObject - CSS Style Rulesの2画面でチェックすると、スタイルシートの利かせ方のチェックがしやすいです。

>>74
ありがとうございました。見事に小さくなってくれました。

DOM Inspector で Document - DOM Nodes は追っかけていたのですが、
Object - CSS Style Rules の方は見ていませんでした。

普通に
div#prContentsArea { display:none !important; }
とするだけだと思います

ニュースだけ見て作ったので他に影響が出てるかもしれませんが

最近またmixiのデザインが変わったので、表示が崩れてきました。

ホームのレビューとミュージックのボタンが消えない…うむむ。

ホームのレビューとミュージックのボタンはオレンジのバーのところですよね？

.review, .music { display: none !important; }
で消えますよ。

えりさん＞
ありがとうございました。おかげで消すことができました。

配布されている「Mixi 3column Customizer」を使っているのですが、
上部固定バーに背景をつけるのはどうやればいいんでしょうか？；

ページをスクロールしたとき固定されたヘッダのナビゲーションに
ページ本文が透けて見えるのが気になってそれを直したいのですが。

「ヘッダのスリム化＆固定表示 」の各々に背景色・白を適用してみたのですが
それでも一部分が透けた状態になるので途方に暮れてます…orz

最近、mixiのホームの下に出てきたトヨタのCMを、「Stylish」を使って非表示にするにはどうすればよいのでしょうか？

ソースを見ながら考えあぐねています。。。よろしければ、どなたか、教えていただけないでしょうか。よろしくお願い致します。

>>87

#impAswfid { display:none !important }

で、どうでしょう。

>>88 むっしゅさん

ありがとうございます！綺麗さっぱり非表示になってくれました。

私は無知なものでclassやidがついていなくてどうにもできなかったので、とても助かりました！

Gmail風にするスタイルシートを作ってみました。

まだトップページだけなので、全部できたらuserstyles.orgに登録しようと思います。

91です。

Google風にするスタイルシートが、トップページ、メッセージページ、日記ページに対応できたので、ベータ版として公開することにしました。

元々閲覧メインの目的で作ってきたので、現在のところは、メッセージを書く、日記を書くページには対応していません。

Google風にするので、Gmixiという名前を付けました。


配布サイト
http://csslabo.googlepages.com/

サポート用コミュニティ
http://mixi.jp/view_community.pl?id=3907166


これから対応ページを増やしていこうと思っています。

すごい＞Gmixi

でも、会社ではGmail禁止 orz

＞95

＞会社ではGmail禁止

何風にすればいいんでしょうねｗ