Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Nov 2011
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Can play bass... not so much on the html/css

    My band has an all flash site, and I've just started putting together a non-flash/mobile-ish site. I use templates, I'm just smart enough to research, problem solve and tweak things to make it look like I want it... barely. Now I'm stuck...

    The mobile site is at www.arisenfromnothing.com/afn.html

    I can't figure out how to change the orange vertical lines in the lower div's

    The stylesheet in question (I think) is this:

    Code:
    /* reset */
    * {
    margin: 0;
    padding: 0;
    }
    
    /* render html5 elements as block */
    header, footer, section, aside, nav, article {
    display: block;
    }
    
    body {
    line-height: 1;
    background: #ddd url("bg.gif") repeat;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: #ddd;
    font-size: 14px;
    line-height: 18px;
    }
    	
    /* layout */
    
    #wrapper {
    position: relative;
    width: 940px;
    margin: 0 auto;
    margin-top: 5px; 
    margin-bottom: 2px;
    -webkit-box-shadow: 3px 3px 7px #111;
    -moz-box-shadow: 3px 3px 7px #777;
    }
    
    nav {
    width: 940px;
    height: 50px;
    margin: 1px;
    background: #000;
    }
    
    header {
    width: 940px;
    height: 900px;
    margin: 2px;;
    background: #fff url(inwt.jpg) no-repeat left top;
    }
    
    #main {
    width: 940px;
    margin: 0 auto;
    padding-top: 30px;
    background: #111 url(colbg1.png) repeat-y;
    overflow: hidden;
    }
    
    #content {
    float: left;
    width: 450px;
    margin-left: 40px;
    }
    
    #sidebar1 {
    float: left;
    padding-left: 20px;
    width: 180px;
    }
    
    #sidebar2 {
    float: right;
    padding-right: 30px;
    width: 180px;
    }
    
    footer {
    width: 940px;
    margin: 0 auto;
    clear: both;
    }
    
    /* basics */
    
    h1,h2,h3,h4,h5,h6 {
    font-weight: bold;
    clear: both;
    color: #ddd;
    }
    
    a:link, a:visited {
    color:#e43202;
    }
    
    a:hover, a:active {
    color: #ff5500;
    }
    
    p {
    margin-bottom: 18px;
    }
    
    li {
    padding-left: 5px;
    }
    
    /* nav */
    
    nav .menu {
    font-size: 16px;
    font-weight: bold;
    }
    
    nav .menu ul {
    margin: 0;
    padding: 17px 0 0 20px;
    list-style: none;
    line-height: normal;
    }
    
    nav .menu li {
    display: block;
    float: left;
    }
    
    nav .menu a {
    display: block;
    float: left;
    margin-right: 5px;
    padding: 0px 15px;
    text-decoration: none;
    color: #337147;
    }
    
    nav .menu a:hover {
    text-decoration: none;
    }
    
    /** HEADER */
    
    header h1, header h2 {
    margin: 0;
    padding: 0 0 0 30px;
    line-height: normal;
    }
    
    header h1 { 	
    float: left;
    padding-top: 20px; 
    font-size: 50px;
    }
    
    header h1 a:link, header h1 a:visited {
    text-decoration: none;
    color: #ddd;
    }
    
    header h1 a:hover { 
    text-decoration: underline; 
    }
    
    header h2 {
    padding: 20px 0 0 30px;
    font-style: italic;
    font-size: 14px;
    color: #555;
    }
    
    #headerlogo {
    position: absolute;
    top:40px;
    right: 43px;
    }
    
    /** ARTICLES **/
    article img {
    border: none;
    }
    
    #content p, ul, ol, hr {
    margin-bottom: 24px;
    }
    
    #content ul ul, ol ol, ul ol, ol ul {
    margin-bottom: 0;
    }
    
    #content h1, h2, h3, h4, h5, h6 {
    color: #111;
    margin: 0 0 20px 0;
    line-height: 1.5em;
    }
    
    .alignleft, img.alignleft {
    display: inline;
    float: left;
    margin-right: 10px;
    }
    
    .alignright, img.alignright {
    display: inline;
    float: right;
    margin-left: 10px;
    }
    
    .aligncenter, img.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
    }
    
    /* sidebar and footer widget blocks */
    
    aside h3 {
    font-size: 18px;
    }
    
    aside ul {
    list-style: none;
    margin-bottom: 20px;
    margin-top: -15px;
    }
    
    #footer-area {
    background: #000;
    border-top: 1px #555 solid;
    color: #FFF;
    font-size: 90%;
    padding: 18px 0;
    overflow: hidden;
    }
    
    .footer-segment {
    float: left;
    margin-right: 20px;
    margin-left: 20px;
    width: 190px;
    }
    
    footer aside h4 {
    color: #555;
    font-size: 16px;
    line-height: 1.5em;
    }
    
    footer p {
    margin-top: -15px;
    }



    Any help would be appreciated
    Last edited by VIPStephan; 11-14-2011 at 11:00 PM. Reason: removed link, wrapped code tags

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,879
    Thanks
    6
    Thanked 1,035 Times in 1,008 Posts
    The vertical lines are in the background image: http://www.arisenfromnothing.com/colbg1.png. So you need to edit the image to change that.

  • Users who have thanked VIPStephan for this post:

    fatbassman (11-14-2011)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •