2017-06-15 54 views
0

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

+0

有方法可以做到这堆...但你的填充CSS给人留下的填充和填充右两个19px。另一种方法是摆脱填充,只留下余量或使用引导程序并使用右移。有其他方式的堆。 – Mike

+0

请你可以检查我的图片是否附有 –

回答

0
.ph-container{ 
    text-align: right; 
} 

这应该做的伎俩

0

.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;  
 

 
}
<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>

+0

这是帮助。你可以请检查附加到我的问题 –

+0

运行代码段它看起来像它的作品 – Mike