Need Some Help With My Webpage

Discussion in 'Spam Heaven' started by Jiin, Jun 20, 2009.

  1. Jiin

    Jiin Well-Known Member

    Age:
    39
    Posts:
    536
    Likes Received:
    0
    Joined:
    Aug 12, 2008
    i am just starting to learn to build websites. i downloaded a template from http://clantemplates.com called 'semigods'. I followed the instructional video on their site, registered over at freewebs.com. I created a folder called images and uploaded all the images given, i uploaded the index.html, and style.css as directed. Unfortunately it did not come out as I hoped. here it is...

    -> http://slw613.webs.com/ <-

    Here's what my files look like on freewebs

    [​IMG]

    and here is whats in the image folder

    [​IMG]

    According to this video tutorial it seems to be right -> http://www.clantemplates.com/video/CT_How_..._to_Upload.html

    but clearly its not. can anyone give me a hand with this?
     
  2. iPro

    iPro Senior Member

    Age:
    34
    Posts:
    2,662
    Likes Received:
    0
    Joined:
    Jan 19, 2006
    Location:
    United States
    Rename your images folder so it has a lowercase "I'.
     
  3. iPro

    iPro Senior Member

    Age:
    34
    Posts:
    2,662
    Likes Received:
    0
    Joined:
    Jan 19, 2006
    Location:
    United States
    Lag ftl.
     
  4. Jiin

    Jiin Well-Known Member

    Age:
    39
    Posts:
    536
    Likes Received:
    0
    Joined:
    Aug 12, 2008
    done that, no change.
     
  5. iPro

    iPro Senior Member

    Age:
    34
    Posts:
    2,662
    Likes Received:
    0
    Joined:
    Jan 19, 2006
    Location:
    United States
    I think its the location of your CSS file. When you view your HTML code on where it links your CSS to your page you'll see the destination is
    Code:
    <link rel="stylesheet" href="./stylesheet/style.css" type="text/css" media="all" />
    You can either make a new folder called stylesheet placing the style.css in there or you can just edit the index.html to

    Code:
    <link rel="stylesheet" href="./style.css" type="text/css" media="all" />
    It should work now :S
     
  6. Jiin

    Jiin Well-Known Member

    Age:
    39
    Posts:
    536
    Likes Received:
    0
    Joined:
    Aug 12, 2008
    wow. yea that was exactly it. smart man. + rep

    and it wont let me + rep. or maybe im just that noob
     
  7. Zohair

    Zohair Formerly zohBOT

    Posts:
    6,128
    Likes Received:
    0
    Joined:
    Dec 18, 2005
    Location:
    Cave
    Don't need to +rep mate it's okay..

    LOL Did you make the changes?
     
  8. Nicasus

    Nicasus Well-Known Member

    Posts:
    4,808
    Likes Received:
    0
    Joined:
    Oct 28, 2005
    Location:
    Somewhere
    Also make it

    href="style.css"

    instead of

    href="./style.css"
     
  9. Jiin

    Jiin Well-Known Member

    Age:
    39
    Posts:
    536
    Likes Received:
    0
    Joined:
    Aug 12, 2008
    yes its working now, thanks for the help! but now i want to do one more thing which i cant figure out how to do. i want to put a bg image in like this. currently this is what it looks like

    [​IMG]

    and this is what im trying to achieve

    [​IMG]

    here is my style sheet if it helps

    Code:
    *
    {
        font:                11px Tahoma, Arial, Sans-serif;
    }
    * html, body
    {
        background-color:        #000000;
        color:                #FFFFFF;
    }
    .box .boxbanner img
    {
        border:                0px;
        width:                552px;
    }
    .box .boxmain .boxcontent
    {
        clear:                both;
        padding:            10px;
    }
    .box .boxmain
    {
        background:            url('../images/content.jpg') no-repeat;
        margin:                0px 0px 20px 3px;
        padding:             0px;
    }
    .box .boxmain .boxtitle
    {
        height:                20px;
    }
    .box .boxmain .boxtitle .left
    {
        float:                left;
        padding:            3px 0px 0px 10px;
    }
    .box .boxmain .boxtitle .right
    {
        float:                right;
        padding:            3px 10px 0px 0px;
    }
    #banner
    {
        background:            #000000 url('../images/banner.jpg') no-repeat;
        clear:                left;
        height:                305px;
    }
    #content
    {
        float:                left;
        width:                552px;
    }
    #content .top, #panel .top
    {
        background:            url('../images/menu_panel.jpg') no-repeat;
        font-weight:            bold;
        height:                23px;
        padding-top:            30px;
        text-align:            center;
    }
    #content .top
    {
        background:            url('../images/menu_content.jpg') no-repeat;
    }
    #content a 
    {
        color:#FFFFFF;
    }
    #content a:hover 
    {
        text-decoration:none;
    }
    #footer
    {
        background:            url('../images/footer.jpg') no-repeat;
        clear:                left;
        height:                115px;
        padding:            10px 60px 0px 0px;
        text-align:            right;
        width:                777px;
    }
    #menu
    {
        background:            #000000 url('../images/menu.jpg') no-repeat;
        height:                116px;
        width:                100%;
    }
    #menu a
    {
        background:            url('../images/menu_normal.jpg') no-repeat;
        color:                #FFFFFF;
        display:            block;
        font:                15px "Trebuchet MS", Tahoma, Arial, Sans-serif;
        font-weight:            bold;
        height:                24px;
        margin-right:            20px;
        padding-top:            90px;
        text-decoration:        none;
        width:                90px;
    }
    * html #menu a
    {
        padding-bottom:            5px;
    }
    #menu a:hover
    {
        background:            url('../images/menu_hover.jpg') no-repeat;
    }
    #menu ul
    {
        list-style-type:        none;
        margin-left:            125px;
    }
    
    #menu ul li
    {
        float:                left;
        text-align:            center;
        background: url('../images/menu_hover.jpg') -100px -100px no-repeat;
    
    }
    #panel
    {
        float:                left;
        width:                225px;
    }
    #panel a#ctlogo
    {
        background:            url('../images/ctlogo.jpg') no-repeat;
        display:            block;
        height:                104px;
        width:                225px;
    }
    #panel li {
        background: url('../images/submenu_hover.jpg') -100px -100px no-repeat;
    }
    #panel li a
    {
        background:            url('../images/submenu_normal.jpg') no-repeat;
        color:                #FFFFFF;
        display:            block;
        height:                21px;
        padding:            2px 0px 0px 20px;
        text-decoration:        none;
        width:                225px;
    }
    #panel li a:hover
    {
        background:            url('../images/submenu_hover.jpg') no-repeat;
    }
    #panel li, #panel ul
    {
        margin:                0px;
        padding:            0px;
    }
    #panel ul
    {
        list-style-type:        none;
    }
    #wrapper
    {
        left:                50%;
        margin-left:            -404px;
        position:            absolute;
        width:                808px;
    }
     
  10. iPro

    iPro Senior Member

    Age:
    34
    Posts:
    2,662
    Likes Received:
    0
    Joined:
    Jan 19, 2006
    Location:
    United States
    Code:
    body
    {
        background-color:        #000000;
        background-image: url(link to image here);
        background-repeat: no-repeat;
        color:                #FFFFFF;
    }

    Been a while since I've messed with web coding, but this should be it.
     
  11. Zohair

    Zohair Formerly zohBOT

    Posts:
    6,128
    Likes Received:
    0
    Joined:
    Dec 18, 2005
    Location:
    Cave
    iPoo once happened to be my love.
     
  12. Nicasus

    Nicasus Well-Known Member

    Posts:
    4,808
    Likes Received:
    0
    Joined:
    Oct 28, 2005
    Location:
    Somewhere
    Actually:


    background: url(link to image here) no-repeat top center #000000;



    Would do some good to let the background image show in the center :>
    I always prefer keeping it simple: just "background" instead of "background-color", "background-image", "background-position" and "background-repeat".


    So:

    Code:
    body {
        color: #FFFFFF;
        background: url(link_to_image.jpg) no-repeat top center #000000;
    }
     
  13. Jynx_

    Jynx_ Banned from GR

    Age:
    33
    Posts:
    177
    Likes Received:
    0
    Joined:
    Jun 6, 2006
    Location:
    Ireland.
    This thread was giving me a fuzzy feeling zohfag posted.
     
  14. iPro

    iPro Senior Member

    Age:
    34
    Posts:
    2,662
    Likes Received:
    0
    Joined:
    Jan 19, 2006
    Location:
    United States
    Forgot about the top center :S
    Patterns > Images :(
     
  15. Nicasus

    Nicasus Well-Known Member

    Posts:
    4,808
    Likes Received:
    0
    Joined:
    Oct 28, 2005
    Location:
    Somewhere
    <3
     

Share This Page