smooth sailing layout

    Date: 05/04/11 (HTML Help)    Keywords: css, html

    Hello! I am working on making some modifications to a layout I'm using for a comm I mod. The layout is in Smooth Sailing format and I am really more familiar with Flexible Squares. Would someone mind looking over the coding and seeing how I can get rid of the header space? Every time I try, it messes up the menu boxes.

    Thanks!

    /* lines: a smooth sailing layout */
    /* Designed by gossymer @ livejournal */

    body {
    background-color: #012227;
    background-image: url('');
    background-position: top left;
    background-repeat: repeat-x;
    background-attachment: fixed;
    }

    .entryHolder {
    margin: 0px auto;
    margin-bottom: 20px;
    padding: 0px;
    padding-bottom: 10px;
    background-color: transparent;
    border-top: 1px solid #eee;
    border-bottom: 0px double #eee;
    }

    a, a:link, a:visited {
    color: #07A08B;
    font-weight: bold;
    text-decoration: none;
    }

    a:hover,a:active {
    color: #505050;
    font-weight: bold;
    text-decoration: none;
    }

    /* Cleaned CSS: */



    /* GENERAL */

    body, p, td, tr, li, dl, dd { font-family: arial; font-size: 8pt; color: #000000; line-height: 150%; text-align: justify; }

    html body
    {
    padding-top: 0 !important;
    }

    #latestmonth td
    {
    text-align:center;
    }

    #lj_controlstrip
    {
    display: none !important;
    }

    div#lj_controlstrip_cprod
    {
    display: none !important;
    }



    .color {
    }

    .important {
    }

    .faded {
    }

    blockquote {
    color: #444;
    margin: 15px;
    padding: 10px 5px;
    border: 1px solid #eee;
    border-top: 5px solid #eee;
    border-bottom: 5px solid #eee;
    }

    ::-moz-selection {
    }

    /*MAIN STRUCTURE*/
    .pageblock {
    margin: 0px auto;
    margin-top: 0px;
    border-left: 25px solid #135342;
    border-right: 25px solid #135342;
    padding-left: 7px;
    padding-right: 7px;
    background-color: #fdfdfd;
    }

    .pageblock, .sidebar {
    width: 640px;
    }
    .entryHolder {
    width: 638px;
    }
    .sidebar {
    margin-left: -320px;
    line-height: 1.5em;
    position: absolute;
    top: 340px;
    left: 50%;
    background-color: transparent;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    }

    .sidebox {
    width: 24%;
    padding: 2px;
    float: left !important;
    background-color: transparent;
    color: #dedede;
    height: 144px;
    margin-left: -1px;
    margin-right: 0px;
    border: 1px solid #eee;
    border-top: 0px solid #eee;
    border-bottom: 0px solid #eee;

    }

    /* HEADER */

    .header-menu a, .header-menu a:visited {
    color: #505050;
    border: 0px solid #eee;
    background-color: transparent;
    padding: 9px;
    margin-left: -1px;
    margin-right: 0px;
    border-right: 1px solid #eee;
    border-left: 1px solid #eee;
    }

    .header-menu a:hover {
    background-color: #eee;
    color: #07A08B;
    }

    .header-menu {
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: center;
    background-color: transparent;
    padding: 7px 0px;
    border: 0px solid #eee;
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
    width: auto;
    margin: 0 auto;
    margin-top: 15px;

    }

    .header-menu ul {
    text-align: center;
    }

    .header-menu li {
    }

    .header-title {
    background-color: transparent;
    font-size: 14pt;
    text-transform: uppercase;
    font-family: times new roman;
    text-align: center;
    font-weight: bold;
    padding: 5px 0px;
    color: #000;
    letter-spacing: 2px;
    background-image: url(http://pics.livejournal.com/gossymer/pic/0045p7sr);
    background-repeat: no-repeat;
    background-position: 50% 20px;
    padding-top: 285px;
    }

    .header-subtitle {
    background-color: transparent;
    color: #888;
    font-size: 10pt;
    height: 175px;
    text-align: center;
    padding: 10px;
    letter-spacing: 2px;
    font-weight: bold;
    }

    .pageheaderblock {
    background-color: transparent;
    border: 0px solid #eee;
    width: auto;
    margin: 0px auto;
    }

    .header-icon {
    }

    /* BODY */

    .bodyblock {
    background-color: transparent;
    margin: 0px auto !important;
    width: auto;
    padding: 0px;
    }

    .bodyheaderblock {
    width: auto;
    padding: 5px;
    margin: 10px 0px;
    background-color: transparent;
    border: 0px solid #eee;
    }

    .bodynavblock a:hover, .bodynavblock a:active {
    }

    .bodynavblock {
    width: auto;
    background-color: transparent;
    margin: 0px;
    border: 0px;
    border: 0px solid #eee !important;
    padding: 0px;
    text-align: center;
    }

    .bodynavblock a, .bodynavblock a:visited {
    color: #07A08B;
    }

    .body-title {
    font-weight: bold;
    font-size: 8pt;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-align: center;
    color: #555;
    }

    .body-midtitle {
    font-weight: bold;
    font-size: 8pt;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-align: center;
    color: #505050;
    }

    /* STRUCTURE - Sidebar */

    #freetext {
    }

    #freetext a:link, #freetext a:active, #freetext a:visited {
    }

    #freetext a:hover {
    }

    .summaryList a:link, .summaryList a:active, .summaryList a:visited {

    }

    .summaryList a:hover {
    }

    .sidebar a:link, .sidebar a:visited {
    color: #505050;
    text-transform: uppercase;
    letter-spacing: .5px;
    display: block;
    border-bottom: 1px dotted #eee;
    font-size: 8pt;
    margin-bottom: -16px;
    }

    .sidebar a:active, .sidebar a:hover {
    color: #07A08B;
    background-color: #eee;
    }

    .sideboxTitle {
    background-color: transparent;
    border-bottom: 1px solid #eee;
    border-top: 0px;
    padding: 0px;
    margin: 0px;
    text-align: center;
    text-transform: uppercase;
    color: #000;
    font-size: 14px;
    font-family: times new roman;
    letter-spacing: 1px;
    font-weight: bold;

    }

    .sideboxContent {
    color: #454545;
    text-align: center;
    letter-spacing: .25px;
    height: 112px;
    overflow: auto;
    font-size: 9pt;
    padding: 5px;
    border-right: 0px solid #eee;
    }

    .sidebox #latestmonth {
    text-align: center;
    line-height: 1.4em;
    color: #fff !important;
    }

    .sidebox #tags_sidebox {
    color: #fff;
    line-height: 1.4em;
    }

    #tags_sidebox a {
    display: block;
    border-bottom: 1px dotted #eee;
    font-size: 8pt;
    margin-bottom: -16px;
    }

    .sidebox #systemlinks {
    line-height: 1.4em;
    }

    #systemlinks .listitem a {
    display: block;
    border-bottom: 1px dotted #eee;
    }

    #systemlinks .listitem a:hover {
    }

    .summaryList {
    display: block;
    border-bottom: 1px dotted #eee;
    line-height: 1.4em;
    }

    .listtitle {
    }

    .profile-label {
    display: none;
    }


    .sidebar select {
    margin-bottom: 6px;
    padding:0px;
    }

    .sidebar input,
    .sidebar textarea,
    .sidebar option {
    margin-top: -2px;
    padding: 0px;
    }

    #latestmonth table{
    text-align: center;
    margin-top: 0px !important;
    }

    .latestmonth-inactive {
    color: #454545;
    text-align: center;
    }

    .latestmonth-active {
    color: #07A08B;
    text-align: center;
    }

    #latestmonth a {
    margin-bottom: -1px;
    }


    /* ENTRY */



    .entryHeader {
    background-color: transparent;
    padding: 5px 15px;
    border-bottom: 1px solid #eee;
    margin-bottom: 0px;
    }

    .entryHeader a {
    color: #fff;
    }

    .entryHeader a:hover {
    }

    .entryHeaderDate a {
    }

    .entryHeaderDate a:hover {
    }

    .entryText {
    width: auto;
    background-color: transparent;
    margin: 0px;
    padding: 15px;
    padding-bottom: 0px;
    }

    .entryHeaderDate {
    color: #777;
    font-size: 9pt;
    text-transform: uppercase;
    }

    .entryHeaderSubject {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 14px;
    font-family: times new roman;
    color: #000;
    padding-left: 0px;
    }

    .entryUserinfo {
    margin: 0px;
    padding: 0px;
    margin: 20px 15px;
    margin-bottom: 2px !important;
    background-color: transparent;
    }

    .entryUserinfo-usericon img {
    padding: 10px;
    border: 1px solid #eee;
    background-color: #fff;
    }

    .entryUserinfo {
    border: 0px solid #eee;
    }

    .entryUserinfo img:hover {
    padding: 10px;
    border: 1px solid #aaa;
    }

    .entryUserinfo-username {
    text-align: center;
    margin-top: 3px;
    }


    .entryMetadata-label {
    }

    .entryMetadata {
    margin: 15px;
    padding: 0px important;
    padding-top: 10px !important;
    border-top: 1px dotted #eee;
    }

    .entryMetadata ul {

    }

    .entryMetadata li {
    display: block;
    line-height: 200% !important;
    font-size: 9pt !important;
    }

    .entryMetadata-content img {
    }

    .entryMetadata a:link, .entryMetadata a:visited {
    color: #888 !important;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    padding: 1px 4px;
    }
    .entryMetadata a:active, .entryMetadata a:hover {
    color: #505050 !important;
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
    padding: 1px 4px;
    }


    .entryLinkbar {
    background-color: transparent;
    border-top: 1px dotted #eee;
    border-bottom: 1px dotted #eee;
    width: auto;
    margin: 7px 0px;
    text-align: center;
    text-transform: uppercase;
    padding: 6px 0px;

    }

    .entryLinkbar ul {
    }

    .entryLinkbar li {
    margin: 0px !important;

    }

    .entryLinkbar a {
    color: #505050;
    font-size: 9pt;
    border-right: 1px dotted #eee;
    border-left: 0px dotted #eee;
    padding: 7px !important;
    margin: -5px;
    }

    .entryLinkbar a:hover {
    color: #07A08B;
    background-color: #eee;
    }

    /*FOOTER*/

    .pagefooterblock a, .pagefooterblock a:link, .pagefooterblock a:visited {
    }

    .pagefooterblock a:hover, .pagefooterblock a:active {
    }

    #footer-menu {
    width: auto;
    background-color: transparent;
    border: 0px;
    padding: 9px;
    text-align: center;
    font-weight: bold;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin: 0px;
    margin-bottom: 10px;
    border-top: 1px solid #eee !important;
    border-bottom: 1px solid #eee !important;
    }

    #footer-menu li {
    }

    #footer-menu ul {
    }

    #footer-menu a, #footer-menu a:visited {
    color: #505050;
    border: 0px solid #eee;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
    background-color: transparent;
    padding: 10px;
    margin: 0px;
    margin-left: -1px;

    }

    #footer-menu a:hover {
    background-color: #eee;
    color: #07A08B;
    }

    .pagefooterblock a, .pagefooterblock a:visited {
    }

    .pagefooterblock {
    position: fixed;
    right: 0px;
    bottom: 0px;
    background-color: #111111;
    border: 0px;
    padding: 0px;
    margin: 0px auto;
    color: #111;
    font-size: 8pt;
    text-align: center;
    width: 15%;
    display: none;
    }

    /* TAG PAGE */

    .tagstable {
    border: 2px solid #eee;
    margin: 25px auto;
    margin-top: 15px;
    width: 95%;
    }

    .tagstable td {
    border-color: #eee;
    padding: 7px;
    }

    .tagstable a:hover {
    }

    /* CALENDAR */

    .daytitles {
    color: #000 !important;
    background-color: #eee;
    border-bottom: 0px solid #eee;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
    }

    .daysubjects {
    }

    .month {
    border-color: #eee;
    width: 87%;
    margin: 30px auto;
    }

    .yearlinks {
    }

    .yearlink {

    }

    .day-blank {
    border-color: #eee;
    }

    .day {
    border-color: #eee;
    }

    .day-date {
    border-color: #eee;
    }

    .day-count {
    font-size: 12pt;
    }

    .day-count a {
    }

    /*WELCOME NOTE*/

    #welcomenoteHolder {
    }

    #welcomenoteHeader {
    }

    #welcomenoteSubject {
    }

    #welcomenoteText {
    }


    code {
    font-family: arial, sans-serif;
    font-size: 8pt !important;
    background-color:
    display: block;
    background-color: #eee;
    padding :2px;
    color:#555;
    line-height: 200%;
    }

    dt {
    font-weight: bold;
    }

    ol, ul {
    }

    dt, ol, dd, p, .sidebox, ul, li, .sideboxContent, .latestmonth-inactive, body, .entryText, td,

    blockquote, .commentText, code {
    color: #333 !important;
    }

    .sidebox td {
    line-height: 150% !important;
    }

    .entryText dt, .entryText ol, .entryText dd, .entryText p, .entryText ul, .entryText li, .entryText

    body, .entryText, .entryText td, .entryText blockquote, .entryText code {
    font-size: 9pt;
    line-height: 180%;
    }

    .ljuser a {
    color: #777;
    }

    .ljuser img {
    margin-right: 2px !important;
    }

    .sidebox #tags_sidebox {
    color: #ffffff !important;
    }

    /* COMMENTS */

    .commentText {
    margin: 10px;
    padding: 0px;
    }

    .commentText a {
    }

    .commentHeaderSubject {
    }

    .commentHeader a {
    }

    .commentLinkbar a, .commentLinkbar a:link, .commentLinkbar a:visited {
    }

    .commentLinkbar a:hover, .commentLinkbar a:active {
    }

    .commentHolder {
    width: auto;
    background-color: transparent;
    border: 0px solid #eee;
    padding: 0px;
    margin: 0px 0px;
    }

    .commentUserinfo {
    margin: 0px;
    padding: 0px;
    margin: 10px 7px;
    margin-bottom: 2px !important;
    background-color: transparent;
    }

    .commentUserinfo-usericon img {
    padding: 10px;
    border: 1px solid #eee;
    background-color: #fff;
    }

    .commentUserinfo {
    border: 0px solid #eee;
    }

    .commentUserinfo img:hover {
    padding: 8px;
    border: 3px solid #aaa;
    }

    .commentUserinfo-username {
    text-align: center;
    margin-top: 3px;
    }

    .commentHeader {
    background-color: transparent;
    border: 0px solid #eee;
    border-top: 1px dotted #eee;
    border-bottom: 1px solid #eee;
    position: relative;
    margin: 0px;
    padding: 7px 15px;
    color: #000;
    }

    .commentHeaderScreened {
    background-color: #eee;
    color: #000;
    }

    .commentLinkbar {
    background-color: transparent;
    border-top: 0px solid #eee;
    width: auto;
    margin: 5px;
    margin-top: 2px !important;
    padding: 5px 0px;
    padding-top: 2px !important;
    text-align: right;
    text-transform: uppercase;
    }

    .commentLinkbar ul {
    }

    .commentLinkbar li {
    }

    .commentLinkbar a {
    color: #505050;
    font-size: 9pt;
    border: 0px dotted #eee;
    border-right: 1px dotted #eee;
    padding: 5px !important;
    margin: -5px;
    }

    .commentLinkbar a:hover {
    color: #07A08B;
    }

    .sidebox #latestmonth {
    color: #fff !important;
    }

    /*general positioning*/

    div.ContextualPopup {
    margin: 7px 0 0 2px;
    }


    /* attaches border to user icon*/

    div.ContextualPopup img {
    border: 1px solid #eee;
    }


    /*defines general look, font color/size/background color*/

    div.ContextualPopup div.Inner {
    background-color: #fff !important;
    color: #666 !important;
    border: 1px solid #aaa;
    padding: 0px;
    width: 20em;
    }


    /*defines left side of popup without the user icon*/

    div.ContextualPopup .Content {
    padding: 2px 4px 4px 4px;
    margin-right: 50px;
    line-height: 1.4;
    }


    /*defines the text that shows the relation to the user (XYZ is your mutual friend) */

    div.ContextualPopup .Relation {
    font-weight: bold !important;
    }


    /* look of words LJ Talk */

    div.ContextualPopup .Content .OnlineStatus {
    font-weight: bold;
    }


    /*element that contains the user icon*/

    div.ContextualPopup .Userpic {
    padding: 4px 4px 0 0;
    }

    /* defines the look of the links*/

    div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
    text-decoration: none !important;
    font-weight: bold;
    color: #07A08B !important;
    }

    Source: http://htmlhelp.livejournal.com/2501321.html

« ... 42nd || Question »


antivirus | apache | asp | blogging | browser | bugtracking | cms | crm | css | database | ebay | ecommerce | google | hosting | html | java | jsp | linux | microsoft | mysql | offshore | offshoring | oscommerce | php | postgresql | programming | rss | security | seo | shopping | software | spam | spyware | sql | technology | templates | tracker | virus | web | xml | yahoo | home