在与固定百分比宽度同一行的CSS显示按钮(css display buttons in same l

我需要使用jQuery移动显示2个按钮的代码是在这里： http://jsfiddle.net/kiranj/rQ3mh/3/

然而，我需要确保1）第一按钮是左对齐，具有40％的固定的宽度和2）第二按钮被右对齐，具有40％的固定宽度

好像我缺少实现这一看似简单的功能，一些重要的事情。感谢所有帮助

作为参考，这里是代码：HTML：

<!DOCTYPE html> 
<html> 
    <head> 
    <title>My Page</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head> 
<body> 

    <br/><br/><br/>
<div  data-role="fieldcontain">
       <input type="submit" name="agree" data-inline="true" data-corners="false" data-theme="b" id="pageptosagree" value="Agree" />
        <input type="submit" data-inline="true" data-corners="false" name="notAgree" id="pagetosdonotagree" value="I Do Not Agree" />
</div>        

</body>
</html>

这里是CSS：

div.divinput div{
    overflow: hidden;
}

div.divinput div.buttonleft div{ 
    width:40%;
    float:left;
}

div.divinput div.buttonright div {
    float:right;
    width:40%;
}

.clear {
  clear: both; 
}

Answer 1:

如果添加/覆盖原来是一些CSS属性jquery.mobile-1.1.0.min.css我想你会得到你想要的结果。试试下面的代码：

CSS

.ui-btn{
width:40%;
}

.ui-btn-up-c,
.ui-btn-hover-c{
float:right;
}

HTML

<div data-role="fieldcontain">
    <input type="submit" name="agree" id="pageptosagree" data-inline="true" data-corners="false" data-theme="b" value="Agree" />
    <input type="submit" name="notAgree" id="pagetosdonotagree" data-inline="true" data-corners="false" value="I Do Not Agree" />
</div>

希望它可以帮助你！

Answer 2:

jQuery的CSS代码更改CSS来：

`.ui-btn-up-c, .ui-btn-hover-c, .ui-btn-down-c {
    float: right;    //just add this single property. Everything will work.
    font-family: Helvetica,Arial,sans-serif;
    text-decoration: none;
}`

你可以发现你正在使用此Jquery的CSS