如何移动按钮

时间:2017-06-15 07:34:44

标签: html css

please can you check my image tha is attached 我将按钮移到右上角时遇到问题

由于某些原因它粘在左上角**

当我开始移动我的按钮时,所有其他元素都会移动**

.ph-button {
    
    border-style: solid;
    border-width: 0px 0px 3px;
    box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.1) inset;
    color: #FFFFFF;    
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    font-style: normal;
    overflow: hidden;
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    transition: all 200ms ease-in-out 0s;
    white-space: nowrap;    
    font-family: "Gotham Rounded A","Gotham Rounded B",Helvetica,Arial,sans-serif;
    font-weight: 700;   
    padding: 9px 19px 9px;
    font-size: 18px;
   


}


/*Red
==========================*/
.ph-btn-red {

    background-color: #ED5A5A !important;
    border-color: #EA4343 !important;



}
.ph-btn-red:hover, .ph-btn-red:focus, .ph-btn-red:active {
    background: none repeat scroll 0 0 #EB4848 !important;
    border-color: #E83131 !important;    

}
<div class="ph-container">
  
    
     <div class="ph-float">
        <a href='#' class='ph-button ph-btn-red'>Ask Question</a>
    </div>    
</div>    

<div class="ph-clear"></div>   

this is how it looks now

2 个答案:

答案 0 :(得分:0)

<div class="ssmp">
  <div class="ssmp-checkbox relative">
    <input type="checkbox" id="ssmp_vac" name="ssmp_vac" style="display: none;">
    <p class="checkbox_div"><span class="box "></span><span class="text" title="">სსმპ ადაპტირებულია</span></p>
    <label for="ssmp_vac" style="display: none;">სსმპ ადაპტირებულია</label>
    <span class="b-16 auto-height m-left-8">
      <i class="icon-16 ssmp-16 m-0"></i>
    </span>
  </div>
  <div class="ssmp-info relative">
    <i class="ssmp-info-icon"></i> მონიშნეთ ჩეკბოქსი თუ ვაკანსია საშუალება განკუთვნილია ან ადაფტირებულია სპეციალური საჭიროების მქონე პირებისთვის
  </div>
</div>

这应该可以解决问题

答案 1 :(得分:0)

&#13;
&#13;
.ph-button {
    
    border-style: solid;
    border-width: 0px 0px 3px;
    box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.1) inset;
    color: #FFFFFF;    
    border-radius: 2px;
    cursor: pointer;
    font-style: normal;
    overflow: hidden;
    float: right;
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    transition: all 200ms ease-in-out 0s;
    white-space: nowrap;    
    font-family: "Gotham Rounded A","Gotham Rounded B",Helvetica,Arial,sans-serif;
    font-weight: 700;   
    padding: 9px 19px 9px;
    font-size: 18px;
   


}


/*Red
==========================*/
.ph-btn-red {

    background-color: #ED5A5A !important;
    border-color: #EA4343 !important;



}
.ph-btn-red:hover, .ph-btn-red:focus, .ph-btn-red:active {
    background: none repeat scroll 0 0 #EB4848 !important;
    border-color: #E83131 !important;    

}
&#13;
<div class="ph-container">
  
    
     <div class="ph-float">
        <a href='#' class='ph-button ph-btn-red'>Ask Question</a>
    </div>    
</div>    

<div class="ph-clear"></div>   
&#13;
&#13;
&#13;