Custom CSS Randomly Disappeared – Freshy, Menu

  • Unknown's avatar
    marissaaross · Member ·

    Hi everyone, thanks for taking a look at this issue. I’m pretty alright with HTML but I really can’t figure this out. Randomly this evening, the custom css of my menu disappeared and I can’t figure out how to get it back up. It wasn’t anything fancy- just plain white with links in caps. I just need to know how to get rid of this gray bar/image that is there. I don’t have an entire custom style sheet, I just added the following to the original Freshy theme. I tried removing all the images from the menu codes but no luck. I really am baffled at how this could happen out of nowhere and any help is appreciated, thank you so so so much! 

    body,html {
font-size:100%;
font-family:Arial, Arial, Arial, sans-serif;
margin:0;
padding:0;
}

body {
background:#FFFFFF;
margin:0;
padding:0;
}

::-moz-selection {
background:#FFFFFF;
color:white;
}

http://marissaaross.wordpress.com/wp-admin/themes.php?page=editcss
::selection {
background:#FFFFFF;
color:white;
}

a {
color:#51da7e;
text-decoration:none;
border-bottom:none;
}

#content a {
color:#51da7e;
border-bottom:none;
}

#content a:hover {
color:#000000;
border-bottom:none;
}

#title_image {
text-align:left;
display:block;
height:350px;
background:url('http://i168.photobucket.com/albums/u161/marissamydear/newbanner-1.jpg') center #FFFFFF no-repeat;
margin:0;
}

#title {
background:url('images/header.gif') top #FFFFFF no-repeat;
height:80px;
clear:both;
text-align:left;
margin:0;
padding:25px 25px 0;
}

html>body #title {
height:51px;
}

#title h1 {
font-weight:bold;
letter-spacing:-.3cm;
line-height:30pt;
font-size:60pt;
text-transform:uppercase;
font-family:arial;
text-align:center;
margin:0;
padding:0;
}

#title h1 a {
color:#51DA7E;
display:block;
}

.description {
color:hide;
}

#page {
background:#ffffff url('images/page_bg.gif') repeat-y scroll center;
text-align:center;
}

#content h2 {
color:#FFFFFF;
border:none;
clear:both;
margin:0;
padding:0;
}

#content h2 a {
text-decoration:none;
border:none;
}

#content h2 a:hover {
color:#000000;
border:none;
}

hr {
display:none;
clear:both;
}

h3,h4 {
color:#51da7e;
clear:both;
margin:2em 0 0;
padding:0;
}

input,textarea,select {
border:1px solid #FFFFFF;
font-size:10pt;
line-height:1em;
font-family:Arial, Arial, Arial, sans-serif;
padding:4px;
}

input,label {
height:auto;
width:auto;
padding:4px;
}

label {
font-size:12pt;
}

#searchform input#s {
width:130px!important;
border:1px solid #e36556;
font-size:.9em;
line-height:1em;
text-transform:none;
color:black;
font-family:Arial, Arial, Arial, sans-serif;
background:white;
padding:4px;
}

#sidebar input.btn,#searchform input {
width:65px;
}

#searchform {
margin-top:10px!important;
}

#searchform br {
display:none;
}

input.btn,#searchform input,input#submit {
background:#111111;
color:#FFFFFF;
border:1px outset #000000;
font-family:arial, arial, Arial, sans-serif;
text-transform:uppercase;
padding:4px;
}

input[class=btn],input[type=submit]
input[id=submit] {
padding:3px;
}

textarea {
overflow:auto;
display:block;
width:100%;
}

ul,ol {
list-style-type:none;
list-style-position:outside;
margin:.2em 0;
padding:0;
}

#content ul li,#content ol li {
background:transparent url('images/puce.png') 2px .4em no-repeat;
padding-left:15px;
}

ul ul li,ol ol li {
background:transparent url('images/bullet.gif') 0 .5em no-repeat;
padding-left:8px;
}

#content ol li {
list-style-type:decimal;
list-style-position:inside;
background:transparent;
padding-left:0;
}

#content ol li li {
padding-left:2em;
}

a img {
border:0 none;
}

form {
margin:0;
padding:0;
}

pre,code {
display:block;
font:1em arial, Courier, Fixed, monospace;
font-size:100%;
color:#000;
background:#FFFFFF url('images/preback.jpg') no-repeat left top;
overflow:auto;
text-align:left;
border:1px solid #51da7e;
line-height:17px;
margin:1em 0;
padding:0 20px 0 30px;
}

.alt {
background-color:#FFFFFF!important;
}

.icon {
vertical-align:middle;
border:0;
}

.with_icon {
padding:2px 0;
}

.navigation {
clear:both;
display:block;
padding:0;
}

.alignleft {
display:block;
float:left;
}

.alignright {
display:block;
float:right;
}

#sidebar {
font-size:10pt;
}

#sidebar ul,#sidebar ol {
padding:0;
}

#sidebar form,#sidebar p {
margin:0 0 1em;
padding:0;
}

#sidebar h2 {
background:#51da7e;
font-size:12pt;
font-weight:bold;
text-transform:uppercase;
color:#ffffff;
margin:10px 0;
padding:8px;
}

#sidebar h2 a {
color:#FFFFFF;
}

html>body .ellipsis li {
clear:both;
}

html>body .ellipsis li:after {
content:"...";
display:inline;
}

html>body .ellipsis li span {
white-space:nowrap;
overflow:hidden;
max-width:180px;
width:auto!important;
display:inline;
float:left;
}

ol.ellipsis li span {
white-space:nowrap;
overflow:hidden;
width:190px;
display:block;
}

#sidebar a {
text-decoration:none;
}

#sidebar a:hover,#sidebar .current_page_item li a:hover,#sidebar .current-cat li a:hover {
color:#000000;
}

#sidebar .current_page_item a,#sidebar .current-cat a {
font-weight:bold;
color:#00000;
}

#sidebar .current_page_item li a,#sidebar .current-cat li a {
font-weight:normal;
color:#000000;
}

#sidebar li img {
vertical-align:middle;
border:0;
}

#sidebar input.btn {
margin-left:4px;
}

.menu {
width:780px;
list-style-type:none;
background:50% 0 #FFFFFF repeat-x;
height:75px;
border-top:1px solid #FFFFFF;
overflow:hidden;
margin:0;
padding:0;
}

.menu li {
background:none;
display:table-row;
vertical-align:middle;
float:left;
height:80px;
padding:0;
}

.menu li.last_menu,.menu li.right_menu {
float:right;
}

.menu li a {
font-size:9pt;
text-transform:uppercase;
line-height:normal;
display:table-cell;
vertical-align:middle;
height:80px;
background:url('images/menu/menu_triple.gif') top left transparent repeat-x;
color:#51da7e;
text-decoration:none;
padding:0 10px;
}

.menu li a:hover,.menu li a:active {
background-position:center left;
color:#66DB00;
}

.menu li.current_page_item a {
background-position:bottom left!important;
color:#51da7e!important;
}

.menu li a.first_menu {
padding-left:35px;
background-repeat:no-repeat;
background-image:url('images/menu/menu_start_triple.gif');
}

.menu li a.last_menu,.menu li a.last_menu_off {
padding-right:35px;
background-repeat:no-repeat;
background-image:url('images/menu/menu_end_triple.gif');
background-position:top right;
}

.menu li a.last_menu:hover,.menu li a.last_menu:active {
background-position:center right;
}

.menu li.current_page_item a.last_menu {
background-position:bottom right!important;
}

.menu li.lang_menu {
float:right;
}

.menu li.lang_menu a span {
width:19px;
height:80px;
overflow:hidden;
text-indent:100px;
display:block;
}

.menu li.lang_menu a {
display:block;
width:19px;
cursor:pointer;
}

.menu li#fr_FR a span {
background:url('images/lang_fr.gif') left transparent no-repeat;
}

.menu li#en_US a span {
background:url('images/lang_en.gif') left transparent no-repeat;
}

.menu li#fr_FR.current_page_item a span,.menu li#fr_FR a:active span {
background-image:url('images/lang_fr.gif');
}

.menu li#en_US.current_page_item a span,.menu li#en_US a:active span {
background-image:url('images/lang_en.gif');
}

#footer {
background:none;
}

#footer .footer_content {
width:760px;
display:block;
margin-right:auto;
margin-left:auto;
margin-top:0;
text-align:center;
padding:10px;
}

.post {
font-size:.9em;
border-top:20px solid #e36556;
margin-bottom:10px;
padding:1em 0;
}

.sticky {
border-top:20px solid #ffffff;
background:#ffffff;
padding:10px;
}

.post h2,.post h3,.post h4,.post h5 {
font-size:2em;
}

.post hr {
display:block;
}

.highlight_box {
font-size:.9em;
border:2px solid #FFFFFF;
margin-bottom:20px;
padding:1em;
}

.highlight_box .post {
font-size:1em;
border:0 none;
margin-bottom:0;
padding:0;
}

.highlight_box .post p {
margin:0;
}

.highlight_box .post .date {
display:none;
}

.highlight_box h2,.highlight_box h3,.highlight_box h4,.highlight_box h5 {
font-size:2em;
border-bottom:10px solid #FFFFFF;
}

.highlight_box .post h2,.highlight_box .post h3,.highlight_box .post h4,.highlight_box .post h5 {
font-size:1.5em;
}

.readmore {
display:block;
text-align:left;
font-weight:bold;
clear:both;
color:#51da7e;
border:none;
margin:1em 0;
}

.date {
color:#000000;
float:right;
line-height:2.3em;
padding-left:5px;
border-left:1px solid #66DB00;
font-size:.8em;
text-align:center;
position:relative;
right:0;
margin:1.5em 0 5px 10px;
}

.date_day {
display:block;
font-size:3em;
text-align:right;
}

.date_month {
display:block;
font-size:3em;
text-align:right;
font-weight:bold;
}

.date_year {
display:block;
font-size:1.4em;
line-height:.9em;
}

#content .postmetadata a {
color:#000000;
text-decoration:none;
border:none;
}

#content .postmetadata a:hover {
color:#66DB00;
border:none;
}

.postmetadata {
color:#66DB00;
list-style-type:none;
margin:0;
}

.clear {
clear:both;
}

.avatar {
float:left;
border:1px solid silver;
vertical-align:middle;
margin:0 5px 0 0;
}

#content .commentlist dt {
position:absolute;
}

html > body #content .commentlist dt {
position:static;
}

#content .commentlist dd {
font-size:1em;
line-height:1.5em;
color:silver;
margin:0 0 1em;
padding:10px 3em 10px 10px;
}

html > body #content .commentlist dd {
padding:10px;
}

#content .commentlist .comment {
color:#000000;
overflow:hidden;
}

#content .commentlist .date {
margin-right:5px;
font-size:.5em;
}

#content .commentlist .comment_text {
margin-top:5px;
display:block;
}

html > body #content .commentlist dd.author_comment {
background:url('images/transp-80.png') #c9e45a!important;
width:auto;
}

#content .commentlist dd.author_comment {
background-color:#c9e45a!important;
filter:alpha(opacity=20);
width:510px;
}

#content .commentlist .author_comment .author,#content .commentlist .author_comment .author a {
color:#c9e45a!important;
border-color:#c9e45a!important;
}

#content .commentlist dd.author_comment * {
filter:alpha(opacity=100);
position:relative;
}

#content .commentlist dt.author_comment .date {
color:#000000!important;
border-color:#66DB00!important;
}

#content textarea#comment {
font-size:1em;
line-height:1.3em;
border:1px solid #e36556;
}

#commentform small {
color:#ffffff;
}

.entry {
text-align:justify;
margin:0;
}

.entry p {
margin:1em 0;
}

img.centered,img.aligncenter {
display:block;
margin-left:auto;
margin-right:auto;
}

img.alignright {
display:inline;
margin:0 0 2px 7px;
padding:4px;
}

img.alignleft {
display:inline;
margin:0 7px 2px 0;
padding:4px;
}

.aligncenter,div.aligncenter {
display:block;
margin-left:auto;
margin-right:auto;
}

.wp-caption {
border:1px solid #66DB00;
text-align:center;
background-color:#66DB00;
padding-top:4px;
border-radius:3px;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
margin:10px;
}

.wp-caption img {
border:0 none;
margin:0;
padding:0;
}

.wp-caption p.wp-caption-text {
font-size:11px;
line-height:17px;
margin:0;
padding:0 4px 5px;
}

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    hallluke · Member ·

    The navigation menu looks OK to me. Could you link to a screenshot of what it looks like for you and explain what it should look like?

  • Unknown's avatar
    marissaaross · Member ·

    Thanks for responding! Truly appreciated cause this is driving me bonkers! This is what it looks like:

    But it is supposed to be just plain white- no gray image or anything- with teal links (#51da7e), like the rest of the site.

    I went through last night & copied the original HTML for the menu from the original style sheet & removed all the images but it STILL won’t go away! I’m stumped! Thank you so much for taking a gander for me!

  • Unknown's avatar
    hallluke · Member ·

    Marissa, I was just about to post a link to the other Freshy CSS thread for you to take a look at but it seems you’ve noticed it already. Could you post the CSS you used just for the menu navigation here using the code tag or backticks so I can take a look at the specific bit that is going wrong? I’m far too lazy to look through the whole load of code you pasted above to see which bit is causing problems.

  • Unknown's avatar
    marissaaross · Member ·

    of course! thanks so much again because although i added the bit of html that the other thread said, i still can’t seem to get rid of that image.

    here is my original HTML:

    .menu {
    width:780px;
    list-style-type:none;
    background:50% 0 #FFFFFF repeat-x;
    height:75px;
    border-top:1px solid #FFFFFF;
    overflow:hidden;
    margin:0;
    padding:0;
    }

    .menu li {
    background:none;
    display:table-row;
    vertical-align:middle;
    float:left;
    height:80px;
    padding:0;
    }

    .menu li.last_menu,.menu li.right_menu {
    float:right;
    }

    .menu li a {
    font-size:9pt;
    text-transform:uppercase;
    line-height:normal;
    display:table-cell;
    vertical-align:middle;
    height:80px;
    background:url(‘images/menu/menu_triple.gif’) top left transparent repeat-x;
    color:#51da7e;
    text-decoration:none;
    padding:0 10px;
    }

    .menu li a:hover,.menu li a:active {
    background-position:center left;
    color:#66DB00;
    }

    .menu li.current_page_item a {
    background-position:bottom left!important;
    color:#51da7e!important;
    }

    .menu li a.first_menu {
    padding-left:35px;
    background-repeat:no-repeat;
    background-image:url(‘images/menu/menu_start_triple.gif’);
    }

    .menu li a.last_menu,.menu li a.last_menu_off {
    padding-right:35px;
    background-repeat:no-repeat;
    background-image:url(‘images/menu/menu_end_triple.gif’);
    background-position:top right;
    }

    .menu li a.last_menu:hover,.menu li a.last_menu:active {
    background-position:center right;
    }

    .menu li.current_page_item a.last_menu {
    background-position:bottom right!important;
    }

    .menu li.lang_menu {
    float:right;
    }

    .menu li.lang_menu a span {
    width:19px;
    height:80px;
    overflow:hidden;
    text-indent:100px;
    display:block;
    }

    .menu li.lang_menu a {
    display:block;
    width:19px;
    cursor:pointer;
    }

    .menu li#fr_FR a span {
    background:url(‘images/lang_fr.gif’) left transparent no-repeat;
    }

    .menu li#en_US a span {
    background:url(‘images/lang_en.gif’) left transparent no-repeat;
    }

    .menu li#fr_FR.current_page_item a span,.menu li#fr_FR a:active span {
    background-image:url(‘images/lang_fr.gif’);
    }

    .menu li#en_US.current_page_item a span,.menu li#en_US a:active span {
    background-image:url(‘images/lang_en.gif’);
    }

    here is the new HTML:

    .menu.primary {
    list-style-type: none;
    background: url(images/menu/menu_bg.gif) 50% 0 #515151 repeat-x;
    margin: 0;
    padding: 0;
    height: 80px;
    width: 780px;
    border-top: 1px solid #FFFFFF;
    overflow: hidden;
    }

    .menu.primary.custom-menu {
    overflow: visible;
    }

    .menu.primary li {
    background: none;
    padding: 0;
    display: table-row;
    vertical-align: middle;
    float: left;
    height: 80px;
    position: relative;
    }

    .menu.primary li.last_menu,
    .menu.primary li.right_menu {
    float: right;
    }

    .menu.primary li a {
    font-size: .8em;
    text-transform: uppercase;
    line-height: normal;
    display: table-cell;
    vertical-align: middle;
    height: 80px;
    padding: 0 10px 0 10px;
    background: url(images/menu/menu_triple.gif) top left transparent repeat-x;
    }

    .menu.primary li a:hover,
    .menu.primary li a:active {
    background-position: center left;
    color: #FFFFFF;
    }

    .menu.primary li.current_page_item a {
    background-position: bottom left !important;
    color: #1F3700 !important;
    }

    .menu.primary li a.first_menu {
    padding-left: 35px;
    background-repeat: no-repeat;
    background-image: url(images/menu/menu_start_triple.gif);
    }

    .menu.primary li a.last_menu,
    .menu.primary li a.last_menu_off {
    padding-right: 35px;
    background-repeat: no-repeat;
    background-image: url(images/menu/menu_end_triple.gif);
    background-position: top right;
    }

    .menu.primary li a.last_menu:hover,
    .menu.primary li a.last_menu:active {
    background-position: center right;
    }

    .menu.primary li.current_page_item a.last_menu {
    background-position: bottom right !important;
    }

    .menu.primary li a {
    color: white;
    text-decoration: none;
    }

    .menu.primary li.lang_menu {
    float: right;
    }

    .menu.primary li.lang_menu a span {
    width: 19px;
    height: 80px;
    overflow: hidden;
    text-indent: 100px;
    display: block;
    }

    .menu.primary li.lang_menu a {
    display: block;
    width: 19px;
    cursor: pointer;
    }

    .menu.primary ul {
    display: none;
    position: absolute;
    top: 57px;
    left: 0;
    float: left;
    z-index: 99999;
    width: 100px;
    }

    .menu.primary ul li {
    height: auto;
    min-width: 100px;
    }

    .menu.primary ul ul {
    left: 100%;
    top: 0;
    margin: 0;
    }

    .menu.primary ul li a {
    background: #000000;
    height: auto;
    width: 80px;
    padding: 10px;
    }

    .menu.primary li:hover > ul {
    display: block;
    }

    /* you-are-here styles */
    .menu.primary ul li a:hover,
    .menu.primary ul li.current_page_item a,
    .menu.primary ul li:hover > a {
    background-color: #252525;
    }
    .menu.primary li.current_page_item li > a,
    .menu.primary li.current_page_parent > a,
    .menu.primary li.current_page_ancestor > a,
    .menu.primary li.current-cat > a,
    .menu.primary li.current-menu-ancestor > a,
    .menu.primary li.current-menu-item > a,
    .menu.primary li.current-menu-parent a {
    background-color: #a3c909 !important;
    background-position: bottom left !important;
    color: #1f3700 !important;
    }

    /*———LANGS———-*/

    .menu.primary li#fr_FR a span {
    background:url(images/lang_fr.gif) left transparent no-repeat;
    }

    .menu.primary li#en_US a span {
    background:url(images/lang_en.gif) left transparent no-repeat;
    }

    .menu.primary li#fr_FR.current_page_item a span,
    .menu.primary li#fr_FR a:active span {
    background-image:url(images/lang_fr.gif);
    }

    .menu.primary li#en_US.current_page_item a span,
    .menu.primary li#en_US a:active span {
    background-image:url(images/lang_en.gif);
    }

    I tried removing all the images but I still can’t get that damn thing to go away!!!

  • Unknown's avatar
    marissaaross · Member ·

    this is what i did with the new html trying to get rid of that damn header but it didn’t work, have no idea what to do! :( :( :( it doesn’t make sense if there are no images in the css!

    /*
    menu
    */

    .menu.primary {
    list-style-type: none;
    background: 50% 0 #FFFFFF repeat-x;
    margin: 0;
    padding: 0;
    height: 75px;
    width: 780px;
    border-top: 1px solid #FFFFFF;
    overflow: hidden;
    }

    .menu.primary.custom-menu {
    overflow: visible;
    }

    .menu.primary li {
    background: none;
    padding: 0;
    display: table-row;
    vertical-align: middle;
    float: left;
    height: 75px;
    position: relative;
    }

    .menu.primary li.last_menu,
    .menu.primary li.right_menu {
    float: right;
    }

    .menu.primary li a {
    font-size: .8em;
    text-transform: uppercase;
    line-height: normal;
    display: table-cell;
    vertical-align: middle;
    height: 80px;
    padding: 0 10px 0 10px;
    background: 50% 0 #FFFFFF repeat-x;
    }

    .menu.primary li a:hover,
    .menu.primary li a:active {
    background-position: center left;
    color: #FFFFFF;
    }

    .menu.primary li.current_page_item a {
    background-position: bottom left !important;
    color: #1F3700 !important;
    }

    .menu.primary li a.first_menu {
    padding-left: 35px;
    background: #FFFFFF;
    }

    .menu.primary li a.last_menu,
    .menu.primary li a.last_menu_off {
    padding-right: 35px;
    background: #FFFFFF;
    }

    .menu.primary li a.last_menu:hover,
    .menu.primary li a.last_menu:active {
    background-position: center right;
    }

    .menu.primary li.current_page_item a.last_menu {
    background-position: bottom right !important;
    }

    .menu.primary li a {
    color: white;
    text-decoration: none;
    }

    .menu.primary li.lang_menu {
    float: right;
    }

    .menu.primary li.lang_menu a span {
    width: 19px;
    height: 75px;
    overflow: hidden;
    text-indent: 100px;
    display: block;
    }

    .menu.primary li.lang_menu a {
    display: block;
    width: 19px;
    cursor: pointer;
    }

    .menu.primary ul {
    display: none;
    position: absolute;
    top: 57px;
    left: 0;
    float: left;
    z-index: FFFFFF;
    width: 100px;
    }

    .menu.primary ul li {
    height: auto;
    min-width: 100px;
    }

    .menu.primary ul ul {
    left: 100%;
    top: 0;
    margin: 0;
    }

    .menu.primary ul li a {
    background: #FFFFFF;
    height: auto;
    width: 75px;
    padding: 10px;
    }

    .menu.primary li:hover > ul {
    display: block;
    }

    /* you-are-here styles */
    .menu.primary ul li a:hover,
    .menu.primary ul li.current_page_item a,
    .menu.primary ul li:hover > a {
    background-color: #FFFFFF;
    }
    .menu.primary li.current_page_item li > a,
    .menu.primary li.current_page_parent > a,
    .menu.primary li.current_page_ancestor > a,
    .menu.primary li.current-cat > a,
    .menu.primary li.current-menu-ancestor > a,
    .menu.primary li.current-menu-item > a,
    .menu.primary li.current-menu-parent a {
    background-color: #FFFFFF !important;
    background-position: bottom left !important;
    color: #51da7e !important;
    }

    .menu.primary li#fr_FR a span {
    background: #FFFFFF left transparent no-repeat;
    }

    .menu.primary li#en_US a span {
    background: #FFFFFF left transparent no-repeat;
    }

    .menu.primary li#fr_FR.current_page_item a span,
    .menu.primary li#fr_FR a:active span {
    background: #FFFFFF;
    }

    .menu.primary li#en_US.current_page_item a span,
    .menu.primary li#en_US a:active span {
    background: #FFFFFF;
    }

  • Unknown's avatar
    sl1k · Member ·

    Thread moved to CSS forum

  • The topic ‘Custom CSS Randomly Disappeared – Freshy, Menu’ is closed to new replies.