Databases
StackOverflow2013
Postsdbo
POTrying to center a link in CSS with the top header but wont move
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POTrying to center a link in CSS with the top header but wont move
    text
    copied!<p>Hello I am trying to keep the links centered of the tan margin. How do I get it centered to the tan margin? Ive tried a few things but margins wont move.</p> <p>this is the website</p> <p><a href="http://codepen.io/willc86/pen/hpFLe" rel="nofollow">http://codepen.io/willc86/pen/hpFLe</a></p> <p>incase you want to see the visual.</p> <p>I am not sure why links dont want to move when I use margin-left or margin-top</p> <p>css is</p> <pre><code>#header{ background-color: tan; width: 90%; Height: 80px; margin: auto; margin-bottom: 30px; text-align: center; } #header a { margin: 40px; border: 3px solid green; } #box{ border: 3px solid red; } #space{ text-align: center; } #leftcolumn { width: 300px; border: 1px solid red; float: left; margin-left: 30px; } #mcolumn { width: 300px; border: 1px solid red; margin: auto; } #rightcolumn { width: 300px; border: 1px solid red; float: right; margin-right: 30px; } .clear { clear: both; } #box2{ border: 3px solid green; margin: 40px; text-align: center; } #bx{ border: 3px solid green; margin: auto; width: 200px; } #box2{ border: 3px solid green; margin: 40px; text-align: center; } #margin{ margin: 30px; } </code></pre> <p>and my html is</p> <pre><code>&lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt; &lt;title&gt;JSP Page&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="header"&gt; &lt;a href="http:www.facebook.com"&gt; Facebook &lt;/a&gt; &lt;a href="http:www.facebook.com"&gt; Google &lt;/a&gt; &lt;a href="http:www.facebook.com"&gt; Yahoo &lt;/a&gt; &lt;/div&gt; &lt;div id="box"&gt; &lt;div id="space"&gt; &lt;div id="leftcolumn"&gt;&lt;p&gt;LEFT&lt;/p&gt;&lt;/div&gt; &lt;div id="rightcolumn"&gt;&lt;p&gt;RIGHT&lt;/p&gt;&lt;/div&gt; &lt;div id="margin"&gt; &lt;div id="mcolumn"&gt;&lt;p&gt;mcolomn&lt;/p&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="clear"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="box2"&gt; &lt;div id="margin"&gt; &lt;div id="bx"&gt; &lt;p&gt; hello what is up &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload