Forums

Give help. Get help.

  • # February 2, 2009 at 11:44 am

    Hi:

    I’m a newcomer to this forum and to building a website. I’m on a Mac OS 10.4, and my site works fine with Safari, Firefox, and IE for Mac … but friends with various incarnations of IE for the PC tell me the links aren’t working. They’re either not there or they wind up at the wrong page.

    I’m wondering if this could be because I’ve attempted to set up two different sorts of links, i.e., cream type on a dark background for the left and bottom nav bars, and colored (red/green/blue) links on the cream-colored content pages.

    If anyone wants to pitch in and help, here’s my website address:

    http://www.maggiedana.com

    I’m pasting my CSS code below. It’s a bit unwieldy and I’m sure could be tightened up, but I come from the world of print layout (I’m a book designer and typesetter) and we approach styles rather differently, hence the staggering number I’ve created in my css stylesheet.

    Many thanks,
    Maggie

    ps: get ready for reams of code!

    body {
    text-align: center;
    margin: 0px;
    padding: 0px;
    background-color: #fefce3;
    background-image: url(images/good-curlies.jpg);
    background-repeat: repeat;
    }
    #wrapper {
    text-align: left;
    width: 960px;
    margin-top: 30px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    background-image: url(images/navbar_background.png);
    background-repeat: repeat-y;
    background-color: #3f3c33;
    }
    #header {
    height: 229px;
    }
    #contentfirstpage {
    margin-top: 0px;
    padding-top: 0px;
    }
    h1 {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 20px;
    font-style: italic;
    line-height: 24px;
    font-weight: normal;
    color: #CC114D;
    text-align: left;
    padding-top: 12px;
    padding-bottom: 0px;
    padding-left: 50px;
    }
    h2 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 15px;
    text-transform: uppercase;
    color: #CC114D;
    padding-left: 50px;
    }
    h3 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 5px;
    text-align: center;
    padding-top: 24px;
    padding-bottom: 12px;
    color: #CC114D;
    }
    .cover_right_small {
    float: right;
    padding-right: 25px;
    padding-left: 12px;
    }
    .story_location {
    font-weight: bold;
    text-align: center;
    font-size: 14px;
    }
    .story_date {
    font-style: italic;
    text-align: center;
    padding-bottom: 24px;
    font-size: 13px;
    }
    .red_rule {
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: #CC114D;
    margin-right: 50px;
    margin-left: 50px;
    margin-bottom: 12px;
    margin-top: 0px;
    }
    p {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    text-align: left;
    margin-top: 2px;
    margin-right: 0px;
    margin-bottom: 2px;
    margin-left: 0px;
    line-height: 20px;
    }
    #leftnavbar {
    float: left;
    width: 215px;
    padding-bottom: 12px;
    padding-top: 3px;
    }
    .leftnavbar_text {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 16px;
    font-style: normal;
    line-height: 24px;
    font-weight: normal;
    color: #fefce3;
    text-align: left;
    padding-left: 28px;
    letter-spacing: 3px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    }
    #rightcol {
    width: 700px;
    padding-right: 25px;
    float: left;
    padding-left: 10px;
    }
    #bottomnavbar {
    clear: both;
    background-color: #3f3c33;
    }
    .cover_image_right {
    float: right;
    padding-left: 20px;
    }
    .bottomnavbar_text {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-align: center;
    padding-top: 4px;
    padding-bottom: 4px;
    color: #fefce3;
    }
    .old_flames {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 20px;
    font-style: italic;
    text-align: left;
    padding-top: 18px;
    color: #fefce3;
    padding-left: 12px;
    }
    .click_to_order {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #fefce3;
    text-align: left;
    padding-bottom: 12px;
    padding-left: 12px;
    }
    .stickupcap_white {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 30px;
    color: #fefce3;
    }
    .stickupcap_red {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 30px;
    color: #CC114D;
    }
    .carrie_author {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 14px;
    color: #fefce3;
    text-align: right;
    padding-top: 12px;
    padding-right: 200px;
    padding-bottom: 12px;
    }
    .book_title {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    padding-bottom: 12px;
    padding-left: 24px;
    }
    img {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    }
    a:link {
    color: #fefce3;
    text-decoration: none;
    }
    a:visited {
    text-decoration: none;
    color: #fefce3;
    }
    a:hover {
    color: #fefce3;
    text-decoration: none;
    background-color: #93907F;
    }
    a:active {
    text-decoration: none;
    color: #fefce3;
    }
    .navbar_bullet {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 50px;
    font-weight: bold;
    color: #CC114D;
    }
    .lowernavbar_bullet {
    font-family: Georgia, Times New Roman, Times, serif;
    font-size: 18px;
    font-weight: bold;
    color: #CC114D;
    }
    .large_space {font-size: 24px}
    .carrie_blurb {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 20px;
    text-align: left;
    padding-left: 30px;
    color: #fefce3;
    }
    #name_of_page {
    text-align: left;
    width: 660px;
    padding-bottom: 15px;
    padding-top: 10px;
    margin-left: 0px;
    }
    #main_content {
    background-color: #fefce3;
    text-align: left;
    width: 645px;
    padding-top: 20px;
    padding-bottom: 30px;
    margin-left: 18px;
    }
    .maintext {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-style: normal;
    line-height: 22px;
    text-align: left;
    text-indent: 24px;
    padding-right: 50px;
    padding-left: 50px;
    }
    .maintext_flushleft {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-style: normal;
    line-height: 22px;
    text-align: left;
    text-indent: 0px;
    padding-right: 50px;
    padding-left: 50px;
    }
    .maintext_flushleft_spacebelow {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-style: normal;
    line-height: 22px;
    text-align: left;
    text-indent: 0px;
    padding-right: 50px;
    padding-left: 50px;
    padding-bottom: 12px;
    }
    .author_flush_right {
    text-align: right;
    padding-top: 0px;
    padding-bottom: 36px;
    padding-right: 50px;
    }
    .childrensblurb {
    font-style: italic;
    padding-right: 75px;
    padding-bottom: 12px;
    padding-left: 75px;
    font-size: 13px;
    }
    .main_text_cAPS_red {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    color: #CC114D;
    letter-spacing: 1px;
    }
    .image_left {
    float: left;
    margin-bottom: 10px;
    margin-right: 15px;
    margin-top: 5px;
    }
    .image_right {
    float: right;
    margin-top: 5px;
    margin-bottom: 10px;
    margin-left: 15px;
    }
    .maintext a:link {
    color: #CC114D;
    font-weight: bold;
    }
    .maintext a:visited {
    color: #336600;
    font-weight: bold;
    }
    .maintext a:hover {
    color: #336699;
    background-color: #fefce3;
    }
    .maintext a:active {
    color: #768789;
    }
    .maintext_flushleft_spacebelow a:link {
    color: #CC114D;
    font-weight: bold;
    }
    .maintext_flushleft_spacebelow a:visited {
    color: #336600;
    font-weight: bold;
    }
    .maintext_flushleft_spacebelow a:hover {
    color: #336699;
    background-color: #fefce3;
    }
    .maintext_flushleft_spacebelow a:active {
    color: #768789;
    }
    .click_to_order a:link {
    color: #fefce3;
    }
    .click_to_order a:visited {
    color: #fefce3;
    }
    .click_to_order a:hover {
    color: #fefce3;
    font-style: italic;
    }
    .click_to_order a:active {
    color: #768789;
    }
    .fabricart a:link {
    color: #CC114D;
    font-weight: bold;
    }
    .fabricart a:visited {
    color: #336600;
    font-weight: bold;
    }
    .fabricart a:hover {
    color: #336699;
    background-color: #fefce3;
    }
    .fabricart a:active {
    color: #768789;
    }
    .letter {
    font-style: italic;
    padding-top: 12px;
    padding-right: 75px;
    padding-bottom: 12px;
    padding-left: 75px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    }
    .red_12_pt_sans {
    color: #CC114D;
    font-size: 12px;
    }
    table {
    background-color: #fefce3;
    margin-left: 36px;
    }
    .photo_caption {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    }
    .fabricart {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    padding-bottom: 12px;
    padding-left: 0px;
    text-transform: none;
    }

    # February 2, 2009 at 4:30 pm

    Thanks, guys. I’ll try reducing the line height (leading) and use padding/margins instead to space things out a bit. As for a UL … I had thought of that but wanted more control over the size and color of the bullet. I couldn’t find a way to increase its size or change its color via CSS, especially when it was also a link. If there is a way … please tell me where to find out about it.

    Like I said, I’m a print typesetter and we have different ways of doing things! Controlling color and size of bullets is pretty straightfoward in Quark or ID … then again, we’re not also asking them to pose as links as well.

    If I may, I’ll come back and ask for someone to check my site again once I’ve done the fixes. Being on a Mac with no direct access to a PC with IE, I’m at the mercy of kindly strangers.

    Maggie

    # February 2, 2009 at 5:59 pm

    Thanks, Doc. I’ll experiment with a GIF. I had already thought about using a GIB image (bullet) here but figured a plain text navigation link would download quicker.

    Maggie

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag