CODEWITHSUNDEEP
html
xBrain978
xBrain978

Reputation: 11

How Do I Center a Button in HTML?

Im trying to design a website for a friend, Ive got the button to show up but I cant seem to get it centered.

<section class="forums" id="forums">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
</head>
<body>
<h3>Have A Suggestion? Post it in our forums!</h3>

<div class="divider">
<div class="hr">
<div class="hr-dot"></div>
</div>
</div>
</div>

<div class="col-md-4" style="text-align: center;">
		<a class="button button-dark" href="#">
				<span class="button-text">
						<input name="Forum" type="button" value="Forums" />
				</span> 
		</a>
</div>
</body>
</html>

Upvotes: 1

Views: 69

Answers (2)

Kaitou Kid
Kaitou Kid

Reputation: 51

According to grid system of Bootstrap, you can do it by changing your class

<div class="col-md-4">
   ...
</div>

to

<div class="col-md-4 col-md-offset-4">
   ...
</div>

Full code here:

<section class="forums" id="forums">
  <html>

  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
  </head>

  <body>
    <h3>Have A Suggestion? Post it in our forums!</h3>

    <div class="divider">
      <div class="hr">
        <div class="hr-dot"></div>
      </div>
    </div>
    </div>

    <div class="col-md-4 col-md-offset-4" style="text-align: center;">
      <a class="button button-dark" href="#">
        <span class="button-text">
						<input name="Forum" type="button" value="Forums" />
				</span> 
      </a>
    </div>
  </body>

  </html>

Upvotes: 2

dalborgo
dalborgo

Reputation: 1

In the code snippet it is centered!

Make sure your div class="col-md-4" is 100% large setting the width to 100%.

Upvotes: 0

Related Questions