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

[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]

[yasumax]

こんにちは。

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

[chantier_sunw]

ありがとうございます。

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

[attachment=11176,280]

[yasumax]

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

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

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

[投稿者]

投稿