[未解決] カートボタンを画像にした際の文字について

ホーム フォーラム テンプレート(テーマ) [未解決] カートボタンを画像にした際の文字について

このトピックには3件の返信が含まれ、2人の参加者がいます。5 年、 3 ヶ月前 yasumax さんが最後の更新を行いました。

4件の投稿を表示中 - 1 - 4件目 (全4件中)
  • 投稿者
    投稿
  • #52950

    chantier_sunw
    参加者

    動作に関するご質問の場合は必ずご記入ください。


    WordPress のバージョン:3.5.2

    Welcart のバージョン:1.3.3

    ご利用のテーマ:Welcart デフォルト

    症状を確認したブラウザ:Safari(Mac)

    サーバー(会社名、サービス名):Lollipop

    SSLの利用: 無し | 専用SSL | 共用SSL

    WordPress のパーマリンク設定:デフォルト


    はじめまして。

    Welcartのデフォルトテーマを利用してネットショップを作っている者です。

    商品詳細ページのカートへ入れるボタンを画像に変えたのですが、その際に、元から存在していたボタンのラベルが消えません。

    CSSで

    .skubutton{

    background-image: url(images/cart_btn.png);

    background-repeat: no-repeat;

    width: 435px;

    height: 60px;

    padding: 0px;

    margin: 0px;

    border:none;

    cursor:pointer;

    overflow:hidden;

    display: block;

    text-indent: 500px;

    }

    .skubutton:hover{

    opacity: 0.6;

    filter: alpha(opacity=60);

    }

    このような感じで記述しています。

    しかし、「カートへ入れる」の「か」の部分だけ消えて、他の文字列は残ってしまいます。

    フック?フィルター?などに関しては無知識なので、どうか親切に教えて下さい。

    [attachment=11157,279]

    #67326

    yasumax
    キーマスター

    こんにちは。

    「.skubutton」の「text-indent」の値を変更してみてください。

    #67327

    chantier_sunw
    参加者

    ありがとうございます。

    一応変更してみたのですが、これ以下の数値にすると「ヵ」も残ってしまいますし、「-9999px」とすると下記画像のように半分で切れてしまいます。

    [attachment=11176,280]

    #67328

    yasumax
    キーマスター

    「.skubutton」に対して別のスタイルが効いてないですか?

    「#●● .skubutton」などのセレクタ名でスタイルを適用していた場合そちらが優先されます。

    Google ChromeやFirefoxなどで要素検証して確認してみてください。

4件の投稿を表示中 - 1 - 4件目 (全4件中)

このトピックに返信するにはログインが必要です。