Jump to content

chickin

New Members
  • Posts

    3
  • Joined

  • Last visited

Posts posted by chickin

  1. I think that's the result of using Photoshop's Save to Web feature to do the coding -- the most recent versions tend to use a huge number of positioned divs, rather than tables. A little better, but still a huge mess to edit and it doesn't really result in clean, organized code.

     

    So what should i do? Any suggestions ?

  2. I'd forget about that for the moment and focus on the html first. Since I cannot actually see the individual components, I may be misjudging, but usually, with HTML/CSS, there is no need for all those divisions. What you have there looks more like an old-fashioned table design that's been 'modernized' - spacer gifs and all.

     

    Instead, you could add your glow images to the right and left border of your main division. I'd also bet that something called 'topspacep can easily be done by CSS alone without the need of its own division.

     

    Can you upload the site somewhere so we can see the whole thing live? (Right now, the individual images are missing, which I'd need to get a better idea of what you're working with)

     

    http://hj4j35b324kjb.site50.net/ Here ya go, Ill have a look into the Ddvs and see what i can do.

  3. Hi, I seem to be having trouble with my newly made website. I have lay'd it out so everything is aligned to the left of the page and fits perfectly together.. But when i zoom out in my web browser, lines between the images emerge and it makes it look bad.. For example shouldc.png

    shouldnt.png

    Here is my CSS source code + HTMl

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="style.css" rel="stylesheet" type="text/css" />
    <title>College Site</title>
    <style type="text/css">
    body {
    background-image: url(images/Background.png);
    background-repeat: -xy;
    }
    </style>
    </head>
    
    <body topmargin="0">
    
    </div>
    <div class="Wrapper">
     <div id="TopSpace1"></div>
     <div id="Logo"></div>
     <div id="TopSpace2"></div>
     <div id="Login">
    
       <div align="left">  Username:<br />
           Password:</div>
     </div>
     <div id="TopSpace3"></div>
     <div id="TopSpace4"></div>
     <div id="LeftGlow"></div>
     <div id="MenuBar"></div>
     <div id="MenuBarSpace"></div>
     <div id="AdSpace"></div>
     <div id="RightGlow"></div>
     <div id="TextBox"></div>
     <div id="RightGlow2"></div>
     <div id="Footer"></div>
     <div id="RightGlow3"></div>
     <div id="End"></div>
    </div>
    
    </body>
    </html>
    

    .Wrapper {
    height: 879px;
    width: 848px;
    margin: auto;
    position: relative;
    }
    #LeftGlow {
    background-image: url(images/7_LeftGlow.png);
    background-repeat: no-repeat;
    float: left;
    height: 810px;
    width: 41px;
    }
    #MenuBar {
    background-image: url(images/8_MenuBar.png);
    background-repeat: no-repeat;
    float: left;
    height: 60px;
    width: 757px;
    }
    #MenuBarSpace {
    background-image: url(images/9_MenuBarSpace.png);
    background-repeat: no-repeat;
    float: left;
    height: 60px;
    width: 50px;
    }
    #AdSpace {
    background-image: url(images/10_AdSpace.png);
    background-repeat: no-repeat;
    float: left;
    height: 236px;
    width: 757px;
    }
    #RightGlow {
    background-image: url(images/11_RightGlow.png);
    background-repeat: no-repeat;
    float: left;
    height: 236px;
    width: 50px;
    }
    #TextBox {
    background-image: url(images/12_TextBox.png);
    background-repeat: no-repeat;
    float: left;
    height: 444px;
    width: 757px;
    }
    #RightGlow2 {
    background-image: url(images/13_RightGlow2.png);
    background-repeat: no-repeat;
    float: left;
    height: 444px;
    width: 50px;
    }
    #Footer {
    background-image: url(images/14_Footer.png);
    background-repeat: no-repeat;
    float: left;
    height: 43px;
    width: 757px;
    }
    #RightGlow3 {
    background-image: url(images/15_RightGlow3.png);
    background-repeat: no-repeat;
    float: left;
    height: 43px;
    width: 50px;
    }
    #End {
    background-image: url(images/16_End.png);
    background-repeat: no-repeat;
    float: left;
    height: 27px;
    width: 807px;
    }
    
    #TopSpace3 {
    background-image: url(images/5_TopSpace3.png);
    background-repeat: no-repeat;
    float: left;
    height: 38px;
    width: 50px;
    }
    #TopSpace4 {
    background-image: url(images/6_TopSpace4.png);
    background-repeat: no-repeat;
    float: left;
    height: 31px;
    width: 230px;
    }
    
    #TopSpace1 {
    background-image: url(images/01_TopSpace1.png);
    background-repeat: no-repeat;
    float: left;
    height: 69px;
    width: 41px;
    }
    #Logo {
    background-image: url(images/2_Logo.png);
    background-repeat: no-repeat;
    float: left;
    height: 69px;
    width: 284px;
    }
    #TopSpace2 {
    background-image: url(images/3_TopSpace2.png);
    background-repeat: no-repeat;
    float: left;
    height: 69px;
    width: 293px;
    }
    #Login {
    background-image: url(images/4_Login.png);
    background-repeat: no-repeat;
    float: left;
    height: 38px;
    width: 180px;
    font-size: 13px;
    font-family: Verdana, Geneva, sans-serif;
    color: #CCC;
    }
    

    I've tried setting all the positioning of the divs but that just scrambled the images around.. Can anyone help me out? Thank you.

×
×
  • Create New...