注目タグ

テンプレート・プラグイン

トピック詳細

画像と文字の高さをあわせたい

よろしくおねがいします

PCテンプレート [ grey_3column ] を使っています

参考画像にあるように

ウサヱもんの文字とオレンジ色のボタンの高さを合わせたいと四苦八苦しています
(画像と「ウサヱもん」のバランスはそのままで)


共有プラグイン「Twitter...A」を使っています

最初画像を入れたときは画像が中央寄りになってしまい

ウサヱもんの文字がオレンジのボタンと被ってしまったので

ほぼやけくそぎみに

<img src="~~~~3.jpg" class="profileImage& quot; alt="ウサヱもん">
<a href="tp://twitter.com/boku_usaemon" target ="_blank">ウサヱもん
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;

とスペースを入れて強引にあわせてしまいました

しかし、ぐぐったり色々調べてみてもどうしても高さが合いません

自分で書いていてよくわからないので恥ずかしいのですが

果たしてこれはプラグインのHTMLを書き換えればよいのか

テンプレートの方から書き換えなくてはいけないのか

もうなにがなんだかさっぱりわからなくなってしまいました

どうかご教授よろしくおねがいします


なにか必要な情報がありましたらすぐに対応します


自分のブログです
http://meikyu1000.blog100.fc2.com/

2011年02月22日 07:46  by ウサヱもん

コメント一覧 8件中、1~8件表示

  • しずの様

    自分で言うのも恥ずかしいのですが
    今確認したらちゃんと合っていました!ありがとうございます!

    ちゃんと確認もせずに失礼なことを書いてしまい申し訳ありませんでした
    (自分では一応したはずなのですが。。。不勉強です)

    とてもすっきりして嬉しい気持ちです!

    今回はとても親切に丁寧に教えて下さってありがとうございました!感謝!

    ウサヱもん

    2011年02月22日 19:16 by ウサヱもん

  • yosoilue様

    ありがとうございます!

    改めて適用してみたのですがやはりうまくいきませんでした。。。

    多分自分がどこかを見落としているのだと思います、すいません

    この度はご親切に本当にありがとうございました、感謝!

    ウサヱもん

    2011年02月22日 19:10 by ウサヱもん

  • ブログの方を拝見させて頂きましたが、
    スタイルシートの更新内容はちゃんと適用されているように思います。
    何か問題がございましたらまたよろしくお願い致します。

    ■備 考
    ブログのレイアウト確認に使用したブラウザ
    Firefox3.6 / IE9β / Googlechrome9

    2011年02月22日 18:52 by しず

  • うーん、プレビューではそうなると思いますが、
    ちゃんと適用すれば表示されると思いますけど。
    プレビューでは中央寄せになるので。

    2011年02月22日 18:49 by ロギラキ

  • しずの様

    ありがとうございます!

    教えてくださったように開き部分に入れてみました
    そしてプレビューで見ると見事に位置が合いました!

    ところがそこでスタイルシートの更新をして

    もう一度プレビューまたは更新をするとなぜか元の状態に戻ってしまうのです

    厚かましいお願いですがなにか考えられる原因があったら
    教えて頂けると嬉しいです


    参考になるかどうかわかりませんが

    ~~~~~

    }
    div.mylog dd.piyolog {
    margin: 0px 0px 5px;
    color: #CCCCCC;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: #FF6600;
    padding: 0px 0px 10px;
    }
    div.license {
    font-size: x-small;
    text-align: right;
    }

    .twPage,#twReloadA{
    margin-top:9px !important;
    }

    ↑ 書き込んだのはここです




    /* Footer
    ----------------------------------------------------------- - */



    どうかよろしくお願いします。


    ウサヱもん

    2011年02月22日 18:34 by ウサヱもん

  • yosoilue様

    ありがとうございます!

    作者の方のブログを読み
    また教えて頂いたようにやってみたのですがうまくできませんでした

    画像+IDが真ん中寄りに移動してしまいボタンと被ってしまいました

    きっとうまくできなかったのは自分がどこか勘違いをしているからだと思うのですが。。。

    本当にありがとうございます!

    2011年02月22日 18:31 by ウサヱもん

  • http://paro2day.blog122.fc2.com/blog-entry-590.html
    作者の方のブログに詳細な解説があります。


    画像を回り込ませないとリンクテキストは上に行かないと思います。

    とりあえず、
    以下の方法でも出来ますが、やり方が正しくはないかもしれません。

    <p class="twUser">
    <img src="画像のURL" align="left&q uot; class="profileImage" alt="" /&g t;
    <a href="http://twitter.com/ユーザーID" target=& quot;_blank">Twitter</a><br clear ="left">

    2011年02月22日 17:49 by ロギラキ

  • スタイルシートの空き部分に


    .twPage,#twReloadA{
    margin-top:9px !important;
    }

    を貼ればボタンの位置が文字の位置と合うように調整できると思います。

    2011年02月22日 12:40 by しず