Question

我认为这很容易，所以我确信我错过了一些简单的事情。我有一个按钮，我想在我的网站上设置样式。这是用来设计它的CSS。

button.popmake-contact-us {
display: inline-block;
height: 50px;
line-height: 50px;
padding-right: 30px;
padding-left: 30px;
position: relative;
font-family: 'Special Elite', 'Inconsolata', 'Droid Sans', serif!important;
font-size: 20px;
background-color: rgb(247, 210, 104);
color: rgb(255,255,255);
text-decoration: none;
text-transform: uppercase;
border-color: #EDE5B1;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
text-shadow: 0px 1px 0px rgba(0,0,0,0.5);
-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true)";
zoom: 1;
filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
box-shadow: -2px -2px 0px rgba(95, 91, 77, 0.13);
-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true)";
filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true);}

.contact_popup_button {position: fixed;bottom: 0px;right: 0px;z-index: 9999;}

这是按钮的HTML。

<footer>

<!--copyright info-->
<p class="footer-copyright">© Copyright 2015 | Sporting Life Bar . All Rights Reserved. </p>   

<!--Form Submission Button-->
<div class="contact_popup_button" style="cursor: pointer;"><button class="popmake-contact-us" style="cursor: pointer;">Contact Us</button></div>

我可以在Chromes Inspeciton工具中练习它的样式，但是一旦我将它添加到子主题中的style.css文件中，它就会回到默认样式。我无法弄清楚为什么会这样做！

有问题的网站如果你想看看那个网站我已经登台了。 http://staging.sportinglifebar.com/

按钮位于网站的最右下方。祈祷有人可以帮我指出正确的方向！

如果它有用，我正在使用wordpress插件＆＃34; Popup Maker＆＃34;设置表单样式并创建弹出窗口。您必须为按钮定义一个类以激活弹出窗口。

Answer 1

选择器中有错误

.popmake-contact-us input[type="button"] { 
    font-family: helvetica; 
    color: #666666; 
    font-size: 12px; 
    border:3px solid; 
    border-color: #000;
}

将查看带有父类popmake-contact-us

的type =按钮的输入

所以你想要的是一个带有类

的按钮

button.popmake-contact-us{ ..style..}

在wordpress的麻烦称呼按钮

1 个答案: