Reply to thread

Message

<blockquote data-quote="Queef" data-source="post: 244349" data-attributes="member: 19889">This tutorial is incredibly basic and should be something every person that can code basic html and css on here should know, sadly, they don't.I usually wouldn't post something like this but I'm sick of seeing messy coding on templates where people have margined their content from the left and the right of the screen because they don't know how to make a simple container.First off [HTML]&lt;div class=&quot;container&quot;&gt;&nbsp; &nbsp; &nbsp; (Your content here)&lt;/div&gt;[/HTML]As mentioned in the above code, place your html for the specific area you're trying to center in the div tags of the container class.Then apply this style,[CODE].container { width: 900px; margin: 0 auto; }[/CODE]You can change the width to whatever you like. The wider it is, the more spaced out and closer to the edges of the screen your content will appear.Now, if theres a certain section in the page that you want to be wider for some reason you could easily do something like, [CODE].container.wider { width: 1000px; }[/CODE]and the HTML for that would be, [CODE]&lt;div class=&quot;container wider&quot;&gt;&lt;/div&gt;[/CODE]</blockquote>

[QUOTE="Queef, post: 244349, member: 19889"] This tutorial is incredibly basic and should be something every person that can code basic html and css on here should know, sadly, they don't. I usually wouldn't post something like this but I'm sick of seeing messy coding on templates where people have margined their content from the left and the right of the screen because they don't know how to make a simple container. First off [HTML]<div class="container"> (Your content here) </div> [/HTML] As mentioned in the above code, place your html for the specific area you're trying to center in the div tags of the container class. Then apply this style, [CODE].container { width: 900px; margin: 0 auto; } [/CODE] You can change the width to whatever you like. The wider it is, the more spaced out and closer to the edges of the screen your content will appear. Now, if theres a certain section in the page that you want to be wider for some reason you could easily do something like, [CODE].container.wider { width: 1000px; }[/CODE] and the HTML for that would be, [CODE]<div class="container wider"> </div>[/CODE] [/QUOTE]

Verification

Reply to thread

Connect with us

Newest members