CODEWITHSUNDEEP
htmlbutton
Gavin
Gavin

Reputation: 91

Making two HTML buttons go side by side

Okay, I'm not very familiar with HTML, or how it comes together with CSS. I have been looking all over on how to make two HTML buttons go side by side. 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.

Upvotes: 9

Views: 43832

Answers (3)

Stevo
Stevo

Reputation: 85

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.

Upvotes: 0

Satinder singh
Satinder singh

Reputation: 10218

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

​

Upvotes: 0

898247
898247

Reputation: 10626

If I understand you correctly, you can just attach the following CSS:

form {
    display: inline;
}

As shown here: http://jsfiddle.net/zcz3j/

Upvotes: 17

Related Questions