在悬停时对齐文本和图像

时间:2014-04-15 19:29:10

标签: html css user-interface uibutton hover

我是CSS的新手。我试图在悬停效果上对齐添加到按钮的图像。这就是我尝试过的。我希望图像与文本一致,如下图所示。 http://tinypic.com?ref=30ll5qg但我得到的是http://tinypic.com?ref=qrds8g

这些是我用来获得它的css:

#button1:hover {    margin-top: 5px;
                    padding: 5px 20px 5px 0;
                    background-color: black;
                    color: #ffcb00;
                    width: 330px;
                    text-align: right;
     }
        #button1:hover:after {
            height: 50px;
            content:  url(img/Arrow.png);
            right:  50%;
            margin-top: 50%;
      }
<div style="margin-top: 10px;">

登录     
      

1 个答案:

答案 0 :(得分:0)

如果您希望图像水平对齐文本,我会<p style="width:full width of text minus width of image">your text here</p>然后将图像和文本放在一个div中,并使用margin-top

定位图像