Jump to content

Adding "Margins" to a website


Bigpapi

Recommended Posts

I hope I am able to explain this right...

 

I am new to web design, and I am wondering how to create margins, or even a template to my site. I am using NVU, as it is a free web design software.

 

When I publish my home page, it goes from one end of the browser to the other. I am wondering how to add, I guess, invisible margins, so that it does not go from end to end. Even looking at this forum, it looks like there is a 1-2 inch margin on either end.

 

Thank you

Link to comment
Share on other sites

Welcome to the forum. Are you looking to center the page (your content)? If so apply the following to your css:

 

#wrapper {

margin: 0 auto;

padding: 0;

}

 

The #wrapper is common. You can name this whatever you want your outside containing div to be

 

Hope this helps

Link to comment
Share on other sites

I am a total newbie here. Where abouts would I apply that too? I am not sure where the CSS starts or begins. Can I see that in the HTML source code?

 

 

The CSS is the styling of your web pages. Think of the html as the blueprint of your website. The CSS is the interior design. You should use an external style sheet to place your CSS. If you are practicing and are new - you can put the CSS styles in the head of your document (in between the

and tags. Jump over to CSS tutorials here on Killer Sites to understand more on CSS (unless you are going to use a template). There is alot of great help here. If you have any questions always feel free to ask. If you can not find what you are looking for - I'm sure one of us can find you a resource stock piled somewhere in our resource folders....
Link to comment
Share on other sites

wow this has been very helpful. I am going through the CSS tutorial now. I am trying to understand something though. Perhaps I am just missing it.

 

After I add code like this (in the

right?):

 

#wrapper {

margin: 0 auto;

padding: 0;

}

 

Do I also need to adjust the 0 to an actual margin amount? The tutorial shoes 15%, but I am just confused on how the code looks all together. When I think I do it correctly, I do not see it when I preview the page, which leads me to believe that I am missing something, somewhere.

Link to comment
Share on other sites

No, the code does not belong into the head section - it belongs in the body section- around everything else in there (See the examples that go with the link I gave you).

 

No, you don't have to adjust the zero - that is for top and bottom. The 'auto' dictates to automatically set the right and left margin so the wrapper and everything it it centers.

 

And don't forget to give that wrapper a width.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...