简体   繁体   English

制作两个HTML按钮并排

[英]Making two HTML buttons go side by side

Okay, I'm not very familiar with HTML, or how it comes together with CSS. 好吧,我不是很熟悉HTML,或者它是如何与CSS结合在一起的。 I have been looking all over on how to make two HTML buttons go side by side. 我一直在寻找如何让两个HTML按钮并排。 Here is the code I'm currently using. 这是我目前正在使用的代码。

<FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank">
  <input type="submit" value="Forum Home Page">
</FORM>
<FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank">
  <input type="submit" value="Skill Guides">
</FORM>

No matter if I put them right after each other or put an alignment infront of them. 无论我是将它们放在彼此之后还是在它们前面对齐。 I can't seem to get them to go next to each other. 我似乎无法让他们彼此相邻。 I hope there is someone that can easily and in a detailed way, help me out. 我希望有人能够轻松而详细地帮助我。

If I understand you correctly, you can just attach the following CSS: 如果我理解正确,您可以附加以下CSS:

form {
    display: inline;
}

As shown here: http://jsfiddle.net/zcz3j/ 如下所示: http//jsfiddle.net/zcz3j/

Demo http://jsfiddle.net/satinder_singh1/wr4Xv/1/ 演示http://jsfiddle.net/satinder_singh1/wr4Xv/1/

<div id="main">
<div class="floatdiv"><FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank">
  <input type="submit" value="Forum Home Page">
</FORM></div>
<div class="floatdiv">
<FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank">
  <input type="submit" value="Skill Guides">
    </FORM></div></div>​

<style type="text/css">
    #main
    {
    position:relative;
        width:200px;
    }

    .floatdiv
    {
    float:left;
        width=80px
    }
</style>

You could also try wrapping them in a table tag. 您也可以尝试将它们包装在表格标签中。 That's how I fixed my similar issue. 这就是我修复类似问题的方法。 The table automatically set them side by side. 该表自动并排设置。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM