解決済
プラグインの幅を狭くしたい
今３カラムのデザインを使用しているのですが本文の幅を広げたかったので広げてみたのですが
プラグインが画面外へといってしまいます。
でも本文の幅は広げたままでいたいので
プラグインの幅を狭くしようと思っているのですが
どうもやり方が分かりません。
どなたかご指導の方よろしくお願いします。
回答(1)
1.
プラグインA(左側)ならID「left」を、プラグインB(右側)ならID「right」を設定します。
幅は「width」の部分でピクセルが指定されていますので、これを変更すれば任意の幅に変更できるでしょう。
↓プラグインA(左側)の幅を100ピクセルにする例
#left{
float:left;
width:100px;
}
記事部分を30px広げたとしたら、サイドバーを30px狭くします。
同量でないとレイアウトが崩れる場合があります。
また、スタイルシートについてよく理解されていない場合、必ずバックアップをとってから編集するようにして下さい。
おかげで自分好みのデザインへと変更できました。
とても助かりました。
本当に今までアドバイスありがとうございました！！
コメント(13)
>>1
何度か試してやってはみたのですが、
どうも上手くいかず、本文の幅は変わるのですが
left、rightのＩＤのwidthの部分はいくら数値を変えて
再構築をしてみても変わりませんでした。(^_^;)
>>#2
ＵＲＬはこちらになります。
http://blog.livedoor.jp/warosmania/?blog_id=158502...
>>#4
一応今よりも本文の幅を広げて
サイドバーは左右とも１８４ピクセルくらいにはしたいのですが
left、right共にピクセルを変更しても反映されませんでした。
何か別のところに問題があるんでしょうかねぇ？(^_^;)
>#5
設定を戻されたのでしょうか？
今もCSSファイルを確認したところ、leftもrightも190pxでした。
>>#5
現在ぬこさんのブログは、このように定義されています。
#left{
position:absolute;
top:0px;
left:10px;
width:190px;
text-align:center;
}
#right{
position:absolute;
top:0px;
right:10px;
width:190px;
text-align:center;
}
ローカル環境でテストした結果がありますが、ご覧になりますか？(キャプチャ画像)
(画像で説明なんて不本意ですが)
設定は元の190pxに戻してました。
画像で説明ですか？それはありがたいです！！
ぜひお願いします！！
http://free.meganebu.com/~pc/sample/
これは、ぬこさんのブログを私のパソコン内で再現したものです。
left、rightの幅を変更した場合をキャプチャしました。
190px、184pxは、leftとrightのwidth値です。
それぞれをクリックしてみて下さい。
ご覧の通り、サイドバーの幅が変わってますよね。
6pxというサイズは、このように比べないとわからないほどですが、ぬこさんが設定した時もこのように反映されているはずです。
記事部分は左右からのマージンが指定されていますので、サイドバーの幅を変えても影響を受けていません。
#blog{
position:relative;
margin-left:220px;
margin-right:220px;
text-align:left;
}
margin-leftとmargin-rightの数値を下げると、左右のサイドバーへ向って記事部分が広くなります。
>>#10
わざわざ画像付きで解説していただき本当にありがとうございます！！
自分のブログだと見た感じ全然分からなかったのですが
今回画像で見た限りだと幅は変更されていたのですね。
すいません。(^_^;)
