Need some help

Discussion in 'Web Design' started by dubbd, Mar 8, 2007.

to remove all ads.
  1. dubbd

    dubbd New Member

    Messages:
    2
    I made a design in photoshop, but I am having problems with it not working right when I have alot of text in the body. I was hoping that someone on here may be able to help me with it. I have it designed but I just need help fixing it to where it will work correctly with large amounts of text.

    Iam using a CMS script to manage the site, so I had to convert the design to a template.

    Here is what the site looks like: www.gznetwork.net/main

    here are the files: www.gznetwork.net/main.zip

    Any help would be greatly appreciated
     
  2. dubbd

    dubbd New Member

    Messages:
    2
    Ok, i tried converting into CSS myself, it looks decent in IE6, but looks terrible in FF.
    Here is the page: www.gznetwork.net/main

    Here is the css code i used:
    Code:
    <style>
    body { background-color: #000;
    	margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0; }
    #container { width: 771px;
    			 background-color: #000;}
    #header { width: 770px; height: 121px; background: #000; margin: 0px 0px;
    			 
    #button a{ color:#FFF; text-decoration: none; border-bottom:thin; padding: 5px 0px 0px 5px }
    #button a:hover{ color:#CC0000; text-decoration: none; font-weight: bold;}
    #button a:visited{ color:#FFF; text-decoration: none; font-weight: bold;}
    #button {
    width: 172;
    float: left;
    clear: left;
    border-right: 0px solid #000;
    padding: 5px 0 1em 0;
    font-family: 'Trebuchet MS', 'Lucida Grande',
    Verdana, Lucida, Geneva, Helvetica,
    Arial, sans-serif;
    font-size: 12px;
    background-color: #331B1C;
    color: #FFF;
    }
    
    #button ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border: none;
    }
    
    #button li {
    border-bottom: 1px solid #000;
    margin: 0;
    }
    
    #button li a {
    display: block;
    padding: 5px 5px 5px 0.5em;
    border-left: 10px solid #422F17;
    background-color: #331B1C;
    color: #fff;
    text-decoration: none;
    width: 100%;
    }
    #navtop { width: 172px; height: 53px; margin: 0px; padding: 0px; float: left; background-color: #331b1c;}
    
    #button li a:hover {
    border-left: 10px solid #FFF;
    background-color: #5C0000;
    color: #fff;
    }
    
    #content {
    	width: 598px;
    	background-color: #12111C;
    	float: none;
    	padding: 1.5em 0px  175px 10px;
    	color: #fff;
    	margin-right: -173px;
      }
    #content a { color: #990000; }
    #content a:hover { color: #FFF; }
    #content a:visited { color: #990000; }
    
    #footer { padding: 15px 0px  0px 10px;
     color: #fff;
     font-size: 9px;
     text-align: center;
     border-top: solid 1px;
     clear: right;
      }
    #footer a { color: #990000; }
    #footer a:hover { color: #FFF; }
    #footer a:visited { color: #990000; }
    Here's what my html looks like in my cms:

    Code:
    <html>
    <head>
    {metadata}
    {stylesheet}
    <title>{sitename} - {title}</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    </head>
    <body>
    <div id="container">
    	<div id="header"> <img src="/main/images/header.gif" width="770" height="121" alt=""></div>
    	
    	<div id="navtop"><img src="/main/images/navtop.gif"></div>
    	<div id="button">
    	
    	<ul><li><a href="#">Home</a></li><li><a href="#">About</a></li><li><a href="#">Artists</a></li><li><a href="#">Downloads</a></li><li><a href="#">Forums</a></li><li><a href="#">Partners</a></li></ul>
    	</div>
    	<div id="content">
    		{content}</div>
    		 <div id="footer">Boondox images and name Copyright of Psychopathic Records<br />
      &copy;2006-2007 All Rights Reserved. </div>
    </body>
    </html>
    
    What am i doing wrong, and what can i do to make it look better?

    Thanks
     
  3. StephanieCordray

    StephanieCordray New Member

    Messages:
    1,017
    You're not doing anything wrong as far as I can tell. It looked the same in both IE and FF for me.
     

Share This Page