试图将我的主页按钮图像直接放在我的注销按钮的左侧

时间:2015-06-16 15:57:52

标签: html css html5

我无法直接在我的退出按钮左侧显示我的主页按钮图像。我已经全面改变了CSS。我也尝试添加中断和额外的行,但这总是会产生意想不到的结果。这是我的HTML代码。

.HomeButton {
    text-decoration:none;
    float:right;
    display:inline-block;
}
.LogoutButton {
    text-align:center;
    width: 10%;
    float:right;
    background-color:#ffec64;
    border:2px solid #ffaa22;
    display:inline-block;
    cursor:pointer;
    color:#333333;
    font-family:Arial;
    font-size:22px;
    font-weight:bold;
    padding:.01% .1%;
    text-decoration:none;
}

这是我的css代码。

{{1}}

2 个答案:

答案 0 :(得分:0)

更改html中锚标记的顺序。

<h1>Add a New Subdiv file  
   <a href="/logout" class="LogoutButton"> Logout </a>
   <a href="/main" class="HomeButton">   
        <img src="../../../../Pictures/dwelling1.png" height="50"/>
   </a>
</h1>

<强>段:

&#13;
&#13;
.HomeButton {
  text-decoration: none;
  float: right;
  display: inline-block;
}
.LogoutButton {
  text-align: center;
  width: 10%;
  float: right;
  background-color: #ffec64;
  border: 2px solid #ffaa22;
  display: inline-block;
  cursor: pointer;
  color: #333333;
  font-family: Arial;
  font-size: 22px;
  font-weight: bold;
  padding: .01% .1%;
  text-decoration: none;
}
&#13;
<tr>
  <td colspan="2" style="height: 100px;" bgcolor="#777d6a">
    <h1>Add a New Subdiv file  
            <a href="/logout" class="LogoutButton"> Logout </a><a href="/main" class="HomeButton">   
        <img src="../../../../Pictures/dwelling1.png" height="50"/></a></h1>
  </td>
</tr>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

嗯,你需要你所说的你需要改变你的html,如<tr> <td colspan="2" style="height: 100px;" bgcolor="#777d6a"> <h1>Add a New Subdiv file <a href="/logout" class="LogoutButton"> Logout </a><a href="/main" class="HomeButton"><img src="../../../../Pictures/dwelling1.png" height="50"/></a></h1></td></tr>