1. This website uses cookies. By continuing to use this website you are giving consent to cookies being used.
    For information on cookies and how you can disable them visit our Cookie Usage page.
    Dismiss Notice

CSS Help with "Gaming Template" CSS Border Size

Discussion in 'Web Development' started by mattvscott, Mar 16, 2011.

  1. mattvscott

    mattvscott New Member

    Hey guy I am using the template called "Gaming Template" found on page9.

    I have edited this template to suit my needs. However, I am running into one problem.

    How to I change the size of the white background. I am wanting to make the menu bar wider to add more website links. I have figured out how to do that, but now I need the background table, I guess you will call it that, to resize to fit the new size of the menu link.

    Please help!
     
  2. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    That all depends on how wide your new menu bar is.
    If you look at the html code and the css file you can follow the progression of the template.
    The first division tag you see in the html file is
    Code:
    <div id="wrapper">
    so if you look in the css file for that division you find two refferences to it.
    Code:
    #wrapper {
        margin: auto;
        text-align: left;
        [COLOR="Red"]width: 710px;[/COLOR]
        position: relative;
    }
    
    #wrapper {
        background: url([COLOR="#ff0000"]images/body_t.gif[/COLOR]) top no-repeat;
        padding-top: 20px;
    }
    
    
    The first sets the over all width of the page and the second is a gif which has the same width as shown below.
    width.jpg

    After you adjust those then you will have to look at the html file code again where you will find
    Code:
    <div id="content">
    and
    <div class="contentbox">
    
    You will have to make adjustments to those as well.
    You may have to adjust the footer and some of the html code to create the page the way you want.
    Remember each is an object you want placed on the page. Each element is defined with a style in the css file. The html file tells the browser what to display.
    Hope this helps.
     
  3. mattvscott

    mattvscott New Member

    Thanks for the reply. I have done that. That is something I have tested and thats what I thought was the answer.

    What that does to my actual page is it takes the content of the "white box" and moves it. For example if I change 710 to say 1200 it moves all of the content to the right. But, it does not actually change the white box or border where that content is.

    What I am looking to do is change the size of that white box. It looks like thats what you were getting at with the image you applied with the ruler. However, when I change that 710 to something bigger it just moves the content to the right and out of that white box.

    Is what you told me how to change the size of the content box? If it is than I will attempt to mess around with it some more.

    Thanks again for helping!
     
  4. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    Basically yes, it is the method you need to use to alter several things in the template to achieve your outcome.
    Have you looked closely at the css file for the placement of some of the images that are located in the images directory that reference the body.
    Look at the images, there names and size, most likely they are the old width size 710px and need to be enlarge also.
    When altering a template it isn't always cut and dry. You have to find the parts that make up what you are looking for. Also think of the parts as building blocks that touch each other, change one and it moves the position of the next.
     
  5. mattvscott

    mattvscott New Member

    Thank you again,

    This has helped alot. Love the templates, the site, and the help.

    I have just started designing pages and alter the templates has made my skills much better.

    I have creating my own template right now, tough learning everything but it all comes together.

    Thanks again!
     
  6. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    Your welcome

    but just when you think it all comes together some new standard comes out and changes a lot of what you knew, like HTML5 standards. lol

    It will interseting to see your new work of art. Maybe you can create one for our forum - Share Your HTML/CSS Templates.