Need help with design

Discussion in 'CSS' started by jminscoe, Aug 17, 2007.

  1. #1
    jminscoe, Aug 17, 2007 IP
  2. mgrohan

    mgrohan Active Member

    Messages:
    671
    Likes Received:
    18
    Best Answers:
    0
    Trophy Points:
    58
    #2
    Looks like having the divs inside the tables. I think you should get rid of the tables and leave it tableless.
     
    mgrohan, Aug 18, 2007 IP
  3. jminscoe

    jminscoe Peon

    Messages:
    1,223
    Likes Received:
    119
    Best Answers:
    0
    Trophy Points:
    0
    #3
    ok I tried to get this to work w/o tables but it messes up everything it works in all browsers except ie any other suggestions
     
    jminscoe, Aug 18, 2007 IP
  4. bryandy

    bryandy Peon

    Messages:
    774
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    0
    #4
    The rollovers are all messed up in Safari aswell, just to let you know, but the site does look nice. Post the style sheet for the menu and I will see if i can help ya
     
    bryandy, Aug 18, 2007 IP
  5. jminscoe

    jminscoe Peon

    Messages:
    1,223
    Likes Received:
    119
    Best Answers:
    0
    Trophy Points:
    0
    #5
    /* ^^^^^^^^ BELOW IS THE CODE FOR THE MENU ^^^^^^^^^^ */
    #menucontainer {
    height:24px;
    background:#000;
    display:block;
    padding:45px 0 0 15px;
    }
    #menu {
    position:relative;
    display:block;
    height:24px;
    font-size:11px;
    font-weight:bold;
    font-family:Arial,Verdana,Helvitica,sans-serif;
    }
    #menu ul {
    margin:0px;
    padding:0;
    list-style-type:none;
    width:auto;
    }
    #menu ul li {
    display:block;
    float:left;
    margin:0 1px 0 0;
    }
    #menu ul li a {
    display:block;
    float:left;
    color:#fff;
    text-decoration:none;
    padding:5px 20px 0 20px;
    height:19px;
    background:transparent url(images/menu_bg-OFF.gif) no-repeat top left;
    }
    #menu ul li a:hover {
    color:#fff;
    background:transparent url(images/menu_bg-OVER.gif) no-repeat top right;
    }
    #menu ul li a.current,#menu ul li a.current:hover {
    color:#000;
    background:#fff;
    }
    /* ^^^^^^^^ ABOVE IS THE CODE FOR THE MENU ^^^^^^^^^^ */
    Code (markup):
    and this is the style sheet
    html, body { 
    margin : 0;
    padding : 0;
    } 
    body { 
    font : 73% Arial, "Trebuchet MS", Helvetica, Tahoma, sans-serif;
    background : #ccc url(images/bg.jpg) top center repeat-y;
    color : #555;
    } 
    #wrap { 
    width : 770px;
    margin-left : auto;
    margin-right : auto;
    padding : 0;
    color : #555;
    background : transparent url(images/wrap_bg.jpg) repeat-x;
    } 
    #masthead { 
    height : 100px;
    padding : 0;
    margin-bottom : 0;
    } 
    #container { 
    width : 770px;
    margin-left : auto;
    margin-right : auto;
    margin-top : 10px;
    padding : 0;
    line-height : 1.8em;
    } 
    a:link, a:visited { 
    color : #E80202;
    background : inherit;
    text-decoration : underline;
    } 
    a:hover { 
    color :  #636363;
    background : inherit;
    text-decoration : none;
    } 
    #content { 
    padding : 1em;
    margin : 0 240px 0 0;
    border-right : 1px solid #eee;
    } 
    #sidebar { 
    float : right;
    width : 200px;
    margin-top : 0;
    padding : 1em;
    } 
    #footer { 
    clear : both;
    height : 50px;
    padding : 0;
    margin-bottom : 0;
    margin-top : 40px;
    text-align : center;
    border-top : 5px solid #E80202;
    color : #fff;
    background : #000;
    } 
    h1 { 
    float : left;
    margin : 0;
    padding : 50px 0 20px 25px;
    font : 150% "Trebuchet MS", Helvetica, Arial, Tahoma, sans-serif;
    letter-spacing : 5px;
    color : #fff;
    } 
    h2 { 
    float : right;
    margin : 0;
    padding : 25px 20px 20px 0;
    font : 90% "Trebuchet MS", Helvetica, Arial, Tahoma, sans-serif;
    letter-spacing : 3px;
    color : #E80202;
    } 
    h3 { 
    margin : 0;
    padding : 20px 0 20px 0;
    border-bottom : 1px solid #aaa;
    font : 150% "Trebuchet MS", Helvetica, Arial, Tahoma, sans-serif;
    text-transform : uppercase;
    letter-spacing : 3px;
    color : #E80202;
    } 
    .left { 
    float : left;
    border : 0 solid #656c4a;
    margin : 5px 0 10px 0;
    padding : 10px;
    } 
    blockquote { 
    padding : 15px;
    color : #555;
    border-bottom : 1px solid #aaa;
    border-top : 1px solid #aaa;
    } 
    legend { 
    color : #E80202;
    } 
    input { 
    background : #eee;
    } 
    /* Link Styles */
    
    select.link-info, select.link-info option {
        width: 74px;
        font-family: tahoma;
        font-size: 11px;
        background-color: #f3f3f3;
    }
    select.link-info {
        font-weight: bold;
        background-color: #f3f3f3;
    }
    select.link-info option {
        font-weight: normal;
        background-color: #ffffff;
    }
    select.link-info option.title {
        font-weight: bold;
        background-color: #f3f3f3;
    }
    
    
    /* Link Recordset Info */
    div.link-rs {
        font-size: 10px;
        padding: 4px;
        color: #777777;
        background-color: #fafafa;
        border: solid 1px #dddddd;
        margin: 0px 0px 12px 0px;
    }
    
    
    
    /* Pager Styles */
    
    table.pager-table {
        background-color: #ccc;
        border: solid 1px #444;
    }
    td.pager-page, td.pager-current, td.pager-link {
        padding: 2px 4px 2px 4px;
        border: 0px;
    }
    td.pager-page {
        background-color: #444;
        color: #ffffff;
    }
    td.pager-current {
        background-color: #bbb;
        color: #000000;
    }
    td.pager-link {
        background-color: #ddd;
        color: #000000;
    }
    td.pager-link a, td.pager-link a:active, td.pager-link a:visited {
        text-decoration: none;
    }
    td.pager-link a:hover {
        text-decoration: underline;
    }
    
    
    
    .link-bidbg {
        background-image: url(images/bidbg.gif);
        height: 32px;
        background-repeat: no-repeat;
    }
    .link-bid {
        text-align: center;
        font-weight: bold;
        color: #ffffff;
        font-size: 11px;
        padding: 3px 0px 2px 0px;
        width: 50px;
    }
    .link-bidbig {
        text-align: center;
        font-weight: bold;
        color: #ffffff;
        font-size: 13px;
        padding: 3px 0px 2px 0px;
        width: 50px;
    }
    .link-place {
        text-align: center;
        font-weight: normal;
        color: #ffffff;
        font-size: 9px;
    }
    .link-place a, .link-place a:active, .link-place a:visited {
        color: #eee;
        text-decoration: none;
    }
    .link-place a:hover {
        color: #ffffff;
        text-decoration: none;
    }
    .link-cell {
        padding: 0px 0px 0px 10px;
    }
    .link-title {
        font-size: 12px;
        font-weight: bold;
    }
    a.link-title, a.link-title:active, a.link-title:visited {
        color: #000;
        text-decoration: none;
        border-bottom: solid 1px #aaaaaa;
    }
    a.link-title:hover {
        text-decoration: none;
        border-bottom: solid 1px #000000;
    }
    .link-desc {
        color: #666666;
        padding: 0px;
    }
    
    .link-date {
        width: 95%;
        color: #000000;
        padding: 3px 0px 3px 5px;
        margin: 5px 0px 0px 0px;
        border: solid 1px #dadada;
    }
    
    /* Form Styles */
    .kForm {
        padding: 0px;
    }
    .kForm input, .kForm textarea {
        padding: 3px;
        margin: 5px 2px 2px 5px;
        color: #555555;
        display: block;
    }
    
    .kForm select {
        margin: 5px 5px 5px 5px;
    }
    .kForm input.submit {
        font-weight: bold;
        margin: 10px 5px 2px 0px;
    }
    .kForm label {
        display: block;
        font-size: 11px;
        font-weight: bold;
        margin: 0px;
        padding: 5px 0px 0px 0px;
    }
    .kFormError {
        font-size: 10px;
        font-weight: normal;
        color: #cc0000;
        display: block;
        margin: 0px 0px 2px 5px;
        padding: 0px;
    }
    .kForm input.error, .kForm textarea.error {
        color: #595300;
        background-color: #fffef2;
        display: block;
    }
    hr {
        padding: 0px;
        margin: 20px 0px 5px 0px;
    }
    ul, ol {
        padding: 0px 0px 5px 20px;
        margin: 5px 0px 5px 15px;
    }
    ul li {
        background-image: url(images/li1.gif);
    	background-repeat: no-repeat;
    	background-position: 0px 0px;
    	display: block;
    	margin: 0px 10px 5px 0px;
    	padding: 0px 0px 0px 25px;
    	list-style-type: none;
        line-height: 16px;
    }
    
    ul.submenu {
        padding: 0px 3px 0px 25px;
        margin: 0px;
    }
    li.submenu {
    	background-repeat: no-repeat;
    	background-position: 0px 0px;
    	display: block;
    	margin: 0px 10px 2px 0px;
    	padding: 0px 0px 3px 15px;
    	list-style-type: none;
        line-height: 10px;
        background-image: url(images/ico_submenu.gif);
    }
    /** Begin Advanced Link Stats Add-on Styles **/
    
    .als-outer {
        width: 240px;
        padding: 0px 0px 0px 5px;
        margin: 0px;
    }
    .als-box {
        width: 75px;
        height: 62px;
        background-color: fdfdf9;
        background-image: url(images/als-boxbg.gif);
        margin: 0px -1px 0px 0px;
        padding: 0px;
        float: left;
        color: #444;
    }
    .als-cell-google, .als-cell-yahoo, .als-cell-msn, .als-cell-technorati {
        width: 75px;
        height: 12px;
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        text-align: center;
        font-size: 10px;
        cursor: default;
    }
    .als-cell-google {
        background-image: url(images/als-google-bg.gif);
        background-repeat: no-repeat;
    }
    .als-cell-yahoo {
        background-image: url(images/als-yahoo-bg.gif);
        background-repeat: no-repeat;
    }
    .als-cell-msn {
        background-image: url(images/als-msn-bg.gif);
        background-repeat: no-repeat;   
    }
    .als-cell-technorati {
        background-image: url(images/als-technorati-bg.gif);
        background-repeat: no-repeat;   
    }
    .als-cell-pagerank {
        width: 75px;
        height: 19px;
        text-align: center;
        font-size: 11px;
        padding: 6px 0px 0px 0px;
        cursor: default;
    }
    .als-tooltip {
        width: 152px;
        height: 40px;
        background-image: url(images/als-tipbg.gif);
        background-repeat: no-repeat;
        margin: -3px 0px 0px -160px;
        padding: 7px 8px 5px 5px;
        text-align: left;
        position: absolute;
        filter:alpha(opacity=90);
        -moz-opacity:0.9;
        opacity: 0.9;
        visibility: hidden;
        display: none;
        line-height: 15px;
        font-size: 10px;
        color: #444;
    }
    .als-ico {
        cursor: default;
    }
    .als-icobox {
        width: 20px;
        height: 19px;
        float: left;
        cursor: default;
        text-align: right;
    }
    .als-tipbox {
        width: 1px;
        height: 1px;
        padding: 18px 0px 0px 0px;
        float: left;
    }
    .als-icobg {
        width: 75px;
        height: 19px;
        text-align: center;
        font-size: 10px;
        padding: 0px 0px 0px 0px;
        background-image: url(images/als-icobg.gif);
        background-repeat: no-repeat;
    }
    
    .als-bid {
        height: 14px;
        background-image: url(images/als_contribution.gif);
        background-repeat: no-repeat;
        font-weight: bold;
        color: #58c012;
        font-size: 10px;
        text-align: left;
        float: left;
        padding: 1px 0px 0px 96px;
        margin: 0px; 
    }
    .als-detail {
        height: 14px;
        padding: 0px;
        margin: 0px 0px 0px 0px;
        float: left;
    }
    .als-linkindex {
        width: 32px;
        height: 22px;
        background-image: url(images/als_bidbg.gif);
        background-repeat: no-repeat;
        padding: 6px 0px 0px 0px;
        margin: 0px;
        text-align: center;
        font-family: tahoma;
        font-size: 12px;
        font-weight: bold;
        color: #cbdcef;
    }
    .als-url {
        padding: 0px 0px 0px 0px;
        color: #aaaaaa;
        font-size: 10px;
    }
    .als-stat-title {
        background-color: #eee;
        color: #777;
        padding: 2px 4px 2px 4px;
        margin: 0px;
        float: left;
        font-size: 9px;
        width: 70px;
    }
    .als-stat-cell {
        background-color: #fafafa;
        color: #444;
        padding: 3px 4px 3px 4px;
        margin: 0px 1px 1px 0px;
        float: left;
        font-size: 10px;
        width: 70px;
        text-align: center;
    }
    /** End Advanced Link Stats Add-on Styles **/
    Code (markup):
     
    jminscoe, Aug 18, 2007 IP