Need help? Check out our Support site, then


Cutline CSS Customization

  1. You have a newer version, so it shouldn't be displaying like that. OS in this case, shouldn't matter.

    Now, in Safari, basically the only difference between your blog and mine is the custom header. Can you reset it to the original image just for a minute? I wanna see if the custom image is giving some kind of problem.

  2. OK. Hold on a second.

    BTW, WordPress Credits are SO comin' your way. :)

  3. you fixed it!

  4. oh, thanks. It's very kind of you, but that's not really necessary :)

  5. When? I justed deleted the header, and reloaded the thread here.

  6. I saw the header with the bees... maybe it was cached. Now I see it's working.... then it's the header what's giving you problems...

    gimme a couple of minutes, I wanna try something

  7. I compared the CSS you sent to me with mine...and in mine I was missing an overflow tag in the content. That must have been it.

  8. I just uploaded the new header...and it works great!

  9. Awesome! so it was the missing overflow, right?

    did it fix how it looks in Opera too? It should have.

  10. No. Opera 9.62 is still weird in the header nav. It still looks like this: http://img153.imageshack.us/img153/3995/123uv1.jpg

    Right, it was the overflow:hidden; missing from the #content declaration.

  11. okay, I'm gonna download the new version and will revise the code. I'll make some tests tomorrow on a windows machine too.

    We got one thing fixed, though. That's a good thing.

  12. Here dev, take off with this CSS...Thanks for all the help!

    a {
    color:#772124;
    text-decoration:none;
    }
    
    a:visited {
    color:#772124;
    text-decoration:none;
    }
    
    a:hover {
    color:#58181b;
    text-decoration:underline;
    }
    
    blockquote {
    font-style:italic;
    font-family:Georgia, "Times New Roman", Times, serif;
    color:#555;
    border-left:1px solid #aaa;
    margin:0 30px 20px;
    padding:0 0 0 10px;
    }
    
    abbr,acronym {
    border-bottom:1px dotted #333;
    text-transform:uppercase;
    cursor:help;
    }
    
    code {
    color:#090;
    font-family:"Courier New", Courier, monospace;
    }
    
    pre {
    width:500px;
    overflow:auto;
    font-size:1.3em;
    float:left;
    clear:both;
    margin:0 0 20px;
    }
    
    * html pre {
    font-size:1em;
    }
    
    p.center {
    text-align:center!important;
    }
    
    p.bottom {
    margin:0!important;
    }
    
    p.unstyled {
    font-size:1.4em;
    }
    
    .flickr_blue {
    color:#007ae4;
    text-transform:lowercase;
    }
    
    .flickr_pink {
    color:#ff2a96;
    text-transform:lowercase;
    }
    
    h1 {
    font:bold 3.8em Helvetica, Arial, sans-serif;
    margin:0;
    padding:0;
    }
    
    * html h1 {
    letter-spacing:-.1em;
    }
    
    #masthead {
    width:auto;
    float:left;
    margin:0;
    padding:0;
    }
    
    #masthead h1 {
    background:#b2ada0;
    border:none;
    margin:0;
    }
    
    h1 a,h1 a:visited,h1 a:hover {
    color:#000;
    text-decoration:none;
    }
    
    h3 {
    font:bold 1.1em Helvetica, Georgia, "Times New Roman", Times, serif;
    letter-spacing:.2px;
    text-transform:uppercase;
    color:#000;
    }
    
    .entry h3 {
    margin:35px 0 10px;
    }
    
    .entry h3.top {
    margin:0 0 10px!important;
    }
    
    h3.comments_headers {
    font-size:1.4em;
    }
    
    body {
    background:#b2ada0;
    color:#333;
    font:62.5% Georgia, "Times New Roman", Times, serif;
    text-align:center;
    }
    
    #container {
    background-color:#b2ada0;
    clear:both;
    overflow:hidden;
    width:810px;
    margin:25px auto 0;
    }
    
    #content_box {
    width:770px;
    text-align:left;
    overflow:hidden;
    clear:both;
    background-color:#fff;
    background:#fff;
    border-right:2px solid #ccc;
    border-left:2px solid #ccc;
    padding:0 18px;
    }
    
    #content {
    background-color:#fff;
    width:500px;
    float:left;
    overflow:hidden;
    padding:18px 40px 0 0;
    }
    
    * html #content {
    background-color:#fff;
    overflow:hidden;
    }
    
    #sidebar {
    background-color:#fff;
    width:230px;
    float:left;
    overflow:hidden;
    }
    
    * html #sidebar {
    background-color:#fff;
    overflow:hidden;
    }
    
    #footer {
    width:790px;
    border-top:2px solid #ccc;
    font:bold 1.4em/1.4em Helvetica, Arial, sans-serif;
    text-transform:uppercase;
    letter-spacing:.3px;
    float:center;
    clear:both;
    padding:12px 10px 10px;
    }
    
    ul#nav {
    list-style:none;
    display:inline;
    width:550px;
    background:#b2ada0;
    border-bottom:0 solid #000;
    float:right;
    clear:none;
    margin:0;
    padding:0;
    }
    
    ul#nav li {
    background-color:#b2ada0;
    font:bold 1.5em Helvetica, Arial, sans-serif;
    letter-spacing:.2px;
    text-transform:uppercase;
    float:left;
    clear:none;
    padding:35px 0 0 17px;
    }
    
    ul#nav li a,ul#nav li a:visited {
    color:#000;
    text-decoration:none;
    }
    
    ul#nav li a:hover {
    color:#772124;
    text-decoration:underline;
    }
    
    ul#nav li a.current,ul#nav li a.current:visited,ul#nav li a.current:hover,ul#nav li.current_page_item a,ul#nav li.current_page_item a:visited,ul#nav li.current_page_item a:hover {
    color:#fff;
    text-decoration:underline;
    }
    
    ul#nav li.rss {
    float:right;
    padding:12px 0 10px;
    }
    
    ul#nav li.rss a {
    background:url('images/icon_rss.gif') 100% 50% no-repeat;
    padding:0 18px 0 0;
    }
    
    #header_img {
    background-color:#fff;
    border-bottom:0 solid #000;
    border-top:2px solid #ccc;
    border-right:2px solid #ccc;
    border-left:2px solid #ccc;
    clear:both;
    margin:-15px 0 0;
    padding:18px 18px 0;
    }
    
    #header_img img {
    display:block;
    }
    
    .sticky {
    background:#f7f7f7;
    margin-bottom:15px;
    padding:15px;
    }
    
    .entry {
    font-size:1.5em;
    line-height:1.5em;
    }
    
    .entry blockquote {
    font-size:1.0em;
    }
    
    .entry blockquote.right {
    width:200px;
    font-style:normal!important;
    font-size:1.3em!important;
    border:3px double #aaa;
    text-align:center;
    float:right;
    border-width:3px 0;
    margin:5px 0 5px 15px !important;
    padding:.3em 0!important;
    }
    
    .entry blockquote.left {
    width:200px;
    font-style:normal!important;
    font-size:1.3em!important;
    border:3px double #aaa;
    text-align:center;
    float:left;
    border-width:3px 0;
    margin:5px 15px 5px 0 !important;
    padding:.3em 0!important;
    }
    
    .entry blockquote.right p,.entry blockquote.left p {
    line-height:1.5em!important;
    margin:0!important;
    }
    
    .entry p {
    margin:0 0 15px;
    }
    
    .entry ul,.entry ol {
    margin:0 0 15px 40px;
    }
    
    .entry ul {
    list-style-type:square;
    }
    
    .entry li {
    margin:0 0 5px;
    }
    
    .entry ul li ul,.entry ul li ol,.entry ol li ul,.entry ol li ol {
    margin:5px 0 5px 30px;
    }
    
    .entry dl {
    margin:0 0 15px;
    }
    
    .entry dt {
    font-weight:bold;
    }
    
    .entry dd {
    margin:0 0 15px 20px;
    }
    
    .entry .gallery dd {
    margin:0;
    }
    
    .entry .ad {
    float:right;
    margin:0 0 15px 15px;
    }
    
    .entry .ad_left {
    float:left;
    margin:0 15px 15px 0;
    }
    
    .entry a img {
    border:0;
    }
    
    .entry img.left {
    border:3px double #bbb;
    float:left;
    clear:left;
    margin:5px 15px 5px 0;
    padding:3px;
    }
    
    .entry img.right {
    border:3px double #bbb;
    float:right;
    clear:right;
    margin:5px 0 5px 15px;
    padding:3px;
    }
    
    .entry img.center {
    display:block;
    border:3px double #bbb;
    float:none;
    clear:both;
    margin:0 auto 15px;
    padding:3px;
    }
    
    .entry img.off {
    border:none!important;
    padding:0!important;
    }
    
    .entry img.stack {
    clear:none!important;
    }
    
    .entry img.wp-smiley {
    border:none!important;
    float:none!important;
    clear:none!important;
    margin:0!important;
    padding:0!important;
    }
    
    .tagged {
    background:url('images/hr_tag_sep.gif') no-repeat;
    font-size:1.2em;
    line-height:1.7em;
    color:#888;
    clear:both;
    margin:0 0 50px;
    padding:5px 0 0;
    }
    
    .tagged a,.tagged a:visited {
    color:#333;
    text-decoration:none;
    padding:3px;
    }
    
    .tagged a:hover {
    color:#fff;
    background:#333;
    text-decoration:none;
    }
    
    .add_comment {
    display:block;
    font-weight:bold;
    float:right;
    padding:0 0 0 20px;
    }
    
    .add_comment a,.add_comment a:visited {
    color:#333;
    text-decoration:none;
    padding:0;
    }
    
    .add_comment a:hover {
    color:#df0000;
    background:none;
    text-decoration:underline;
    }
    
    .navigation {
    width:500px;
    font-size:1.6em;
    float:left;
    margin:0 0 40px;
    }
    
    * html .navigation {
    margin:0 0 30px;
    }
    
    .previous {
    float:left;
    padding:0 20px 0 0;
    }
    
    .next {
    float:right;
    }
    
    .clear {
    width:500px;
    height:1px;
    clear:both;
    }
    
    #sidebar a img {
    border:none;
    }
    
    ul.sidebar_list {
    list-style:none;
    }
    
    ul.sidebar_list li.widget {
    width:230px;
    font-size:1.3em;
    line-height:1.4em;
    float:left;
    margin:0 0 30px;
    }
    
    li.widget h2,li.linkcat h2 {
    font-weight:bold;
    font-size:1.1em;
    text-transform:uppercase;
    letter-spacing:normal;
    border-top:3px solid #000;
    background:url('images/hr_dot_black.gif') 0 100% repeat-x;
    margin:0 0 10px;
    padding:6px 2px;
    }
    
    li.widget p {
    margin:0 0 15px;
    padding:0 10px;
    }
    
    li.widget a img {
    border:none;
    }
    
    li.widget ul,li.linkcat ul {
    list-style:square;
    margin:0 0 15px 20px;
    }
    
    li.widget ol {
    margin:0 0 15px 20px;
    }
    
    li.widget li,li.linkcat li {
    margin:0 0 8px;
    }
    
    li.widget li a,li.widget li a:visited,li.linkcat li a,li.linkcat li a:visited {
    text-decoration:none;
    }
    
    li.widget li a:hover,li.linkcat li a:hover {
    text-decoration:underline;
    }
    
    li.widget li .recent_date {
    font-weight:bold;
    color:#888;
    padding:0 0 0 8px;
    }
    
    li.widget ul.flickr_stream {
    list-style:none;
    margin:0;
    padding:0 10px;
    }
    
    li.widget ul.flickr_stream li {
    display:inline;
    margin:0;
    padding:0 5px 5px 0;
    }
    
    li.widget ul.flickr_stream li a img {
    padding:3px;
    }
    
    li.widget ul.flickr_stream li a:hover img {
    background:#ff2a96;
    }
    
    li.widget_flickrrss a img {
    margin:0 5px 5px 0;
    padding:3px;
    }
    
    li.widget_flickrrss a:hover img {
    background:#ff2a96;
    }
    
    #calendar_wrap {
    font-size:1.2em;
    }
    
    ul.sidebar_list li#linkcat-1,ul.sidebar_list li#linkcat-2,ul.sidebar_list li#linkcat-3,ul.sidebar_list li#linkcat-4,ul.sidebar_list li#linkcat-5,ul.sidebar_list li#linkcat-6,ul.sidebar_list li#linkcat-7,ul.sidebar_list li#linkcat-8,ul.sidebar_list li#linkcat-9 {
    width:230px;
    font-size:1.2em;
    line-height:1.4em;
    float:left;
    margin:0 0 30px;
    }
    
    ul.sidebar_list li#linkcat-1 h2,ul.sidebar_list li#linkcat-2 h2,ul.sidebar_list li#linkcat-3 h2,ul.sidebar_list li#linkcat-4 h2,ul.sidebar_list li#linkcat-5 h2,ul.sidebar_list li#linkcat-6 h2,ul.sidebar_list li#linkcat-7 h2,ul.sidebar_list li#linkcat-8 h2,ul.sidebar_list li#linkcat-9 h2 {
    font-weight:bold;
    font-size:1.2em;
    text-transform:uppercase;
    letter-spacing:normal;
    border-top:3px solid #000;
    background:url('images/hr_dot_black.gif') 0 100% repeat-x;
    margin:0 0 10px;
    padding:6px 2px;
    }
    
    ul.sidebar_list li#linkcat-1 ul,ul.sidebar_list li#linkcat-2 ul,ul.sidebar_list li#linkcat-3 ul,ul.sidebar_list li#linkcat-4 ul,ul.sidebar_list li#linkcat-5 ul,ul.sidebar_list li#linkcat-6 ul,ul.sidebar_list li#linkcat-7 ul,ul.sidebar_list li#linkcat-8 ul,ul.sidebar_list li#linkcat-9 ul {
    list-style:square;
    margin:0 0 15px 20px;
    }
    
    ul.sidebar_list li#linkcat-1 li,ul.sidebar_list li#linkcat-2 li,ul.sidebar_list li#linkcat-3 li,ul.sidebar_list li#linkcat-4 li,ul.sidebar_list li#linkcat-5 li,ul.sidebar_list li#linkcat-6 li,ul.sidebar_list li#linkcat-7 li,ul.sidebar_list li#linkcat-8 li,ul.sidebar_list li#linkcat-9 li {
    margin:0 0 8px;
    }
    
    ul.sidebar_list li#linkcat-1 li a,ul.sidebar_list li#linkcat-2 li a,ul.sidebar_list li#linkcat-3 li a,ul.sidebar_list li#linkcat-4 li a,ul.sidebar_list li#linkcat-5 li a,ul.sidebar_list li#linkcat-6 li a,ul.sidebar_list li#linkcat-7 li a,ul.sidebar_list li#linkcat-8 li a,ul.sidebar_list li#linkcat-9 li a {
    text-decoration:none;
    }
    
    ul.sidebar_list li#linkcat-1 li a:hover,ul.sidebar_list li#linkcat-2 li a:hover,ul.sidebar_list li#linkcat-3 li a:hover,ul.sidebar_list li#linkcat-4 li a:hover,ul.sidebar_list li#linkcat-5 li a:hover,ul.sidebar_list li#linkcat-6 li a:hover,ul.sidebar_list li#linkcat-7 li a:hover,ul.sidebar_list li#linkcat-8 li a:hover,ul.sidebar_list li#linkcat-9 li a:hover {
    text-decoration:underline;
    }
  13. Okay, in the definition of h1, change the font-size to 3.5em

    Opera is displaying the font a bit bigger than it should (compared to other browsers, even with one of its early versions). Weird.

    Check this out

    http://sandboxskins.wordpress.com/

  14. You got it! That was the problem.

  15. Still a problem on my site. Maybe the nav...

  16. You might want to reduce the font-size of your links too, since links is going down one line... just a tad bit

  17. try 1.2em?

  18. Bingo! Decreased the Nav size as well...I have more links in the nav list than you do. It looks awesome in all the major browsers now, thanks to you!

    Now about IE6... :)

  19. Which links? The nav?

  20. yeah, I was talking about the nav bar.

    I don't have IE6 here, I'll check that tomorrow at the office. If changes are needed, I'll let you know.

    Glad I could be of help.

  21. Yes, I set the nav bar to 1.5em. It was at 1.7em.

    Thank you so much, devblog. I appreciate it very much. Credits in the mail!

  22. Where the links 1.7em? I thought they were 1.5... I must've seen the wrong selector then.

    Now, just wanted to let you know that your blog is looking good in IE6 too. Nice.

  23. dev, thanks again so much! I really appreciate your help on the debug.

    BTW, your new css looks AWESOME! → http://sandboxskins.wordpress.com

Topic Closed

This topic has been closed to new replies.

About this Topic