#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    1
    Rep Power
    0

    HELP w/ CSS on wordpress & compatibility


    Hello, my name is Michelle and I am in charge of running http://sacramentocitd.org. It is powdered by wordpress.org. If anyone can help me with a really tricky question, that would be great!

    I was switching back and forth between skins, and ultimately went back to the original style skin that was on the page, which is #4 (just FYI). The ribbon's designated color is Orange, however it is showing black on other browsers such as IE. On my computer, and most others, it shows orange on Chrome & Firefox but not IE or Safari. However, on my boss's computer it shows black ribbons on every web browser. Prior to me switching back and forth, all browsers showed orange. I did not switch or touch any off the css/html in the set skin.

    I am using the Unite theme by Parallelus, style skin #4. If anyone is familiar with this, please shoot me a message. ANY help would be greatly appreciated!! Below is the current css on my webpage.

    **This is the area of the CSS layout that designates orange ribbons, just so its a little bit quicker to find**
    Code:
    /* ribbon elements (wrap around) */
    
    .ribbon .wrapAround	{ background-image: url("images/skins/skin-4/ribbon-wrap.png"); }	/* ribbon edge (wrap around, changes on scroll) */
    .ribbon .tab		{ background-image: url("images/skins/skin-4/ribbon.png"); }		/* ribbon main section */
    Code:
    /***  Skin Styles  ***/
    
    body			{ color: #595959; } /* default font color */
    #Wrapper, body	{ background: #395e95 url("images/skins/skin-2/bodyBg.jpg") repeat-x 0 0; }	/* background color/graphic */
    
    /* logo */
    
    #Logo a		{ background-image: url("images/skins/skin-4/logo.png"); }
    .logoMark	{ background-image: url("images/skins/skin-4/logoSymbol-small.png"); }	
    	
    /* links and menus */
    
    a, a:link, a:visited							{ color: #579B9B; }	/* default links */
    a:hover, a:active								{ color: #F3861B; }	/* default hover */
    
    .ribbon span a:link, .ribbon span a:visited 	{ color: #fff; }	/* ribbon links (wrap around graphic)  */
    .ribbon span a:hover, .ribbon span a:active 	{ color: #A4D9D7; }	/* ribbon hover */
    
    #Footer a:link, #Footer a:visited,
    #ContentPanel a:link, #ContentPanel a:visited	{ color: #fff; }	/* dark backgrounds */
    #Footer a:hover, #Footer a:active,
    #ContentPanel a:hover, #ContentPanel a:active	{ color: #CDB581; }	/* dark backgrounds, hover */
    
    /* main menu */
    
    #MmLeft		{ background-image: url("images/skins/skin-4/mainMenu-left.png"); }		/* menu background graphics */
    #MmRight	{ background-image: url("images/skins/skin-4/mainMenu-right.png"); }
    #MmBody		{ background-image: url("images/skins/skin-4/mainMenu-repeat.png"); }
    .mmDivider	{ background-image: url("images/skins/skin-4/mainMenu-divider.gif"); }
    
    #MainMenu a:link, #MainMenu a:visited								{ color: #D9D8D5; }			/* links - top level */
    #MainMenu a:hover, #MainMenu a:active								{ color: #fff; }			/* hover - top level */
    #MainMenu li li a:link, #MainMenu .sf-menu li li a:visited 			{ color: #fff; }			/* links - sub-menus  */
    #MainMenu .sf-menu li li											{ background: #69665F; }	/* background color - sub-menus */
    #MainMenu .sf-menu li li li											{ background: #4D4A45; }	/* background color - sub-sub-menus */
    #MainMenu .sf-menu li li:hover, #MainMenu .sf-menu li li.sfHover, 
    #MainMenu .sf-menu li li a:focus, #MainMenu .sf-menu li li a:hover, 
    #MainMenu .sf-menu li li a:active									{ background: #403D39; color: #fff;}	/* hover - sub-menus */
    
    /* headings */
    
    h1, h2, h3, h4, h5, h6, .headline, .title, 
    .ribbon span, #fancybox-title-main						{ color: #8A867D; }	/* default headings color */
    .headline												{ color: #696969; }	/* headlines (page titles, etc) */
    h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, 
    h6 strong, .headline strong, .title strong 				{ color: #318391; }	/* headline accent (added using <strong>inside</strong> heading) */
    h1 span, h2 span, h3 span, h4 span, h5 span, h6 span, 
    .headline span, .title span								{ color: #000;}	/* sub-heading text (added using <span>inside</span> heading */	
    #Footer h1, #Footer h2, #Footer h3, #Footer h4, 
    #Footer h5, #Footer h6, #ContentPanel h1, 
    #ContentPanel h1, #ContentPanel h2, #ContentPanel h3, 
    #ContentPanel h4, #ContentPanel h5, #ContentPanel h6	{ color: #eee;} 	/* headings on dark/color background areas */
    #ContentPanel h1 span, #ContentPanel h2 span, 
    #ContentPanel h3 span, #ContentPanel h4 span, 
    #ContentPanel h5 span, #ContentPanel h3 span, 
    #ContentPanel.headline span, #ContentPanel.title span	{ color: #D8DBB5;} 	/* sub-heading text on dark/color background areas */
    #cluetip h3												{ color: #eee; }	/* tool tip titles */
    
    /* other text */
    
    .ribbon span 						{ color: #EFDABE; }	/* ribbon text (wrap around graphic) */
    #Footer, #ContentPanel, #cluetip	{ color: #999; }	/* text on dark/color background areas */
    
    /* forms and inputs */
    
    input 					{ color: #000; }	/* input text color */
    textarea, .textInput 	{ background-color: #E1E2E3; background-image: url("images/skins/skin-4/inputBg.gif");	/* input background */
    						  border-color: #C9CACB #fff #fff #C9CACB;}	/* input border color */
    label.overlabel			{ color: #B3B4B4; }	/* text input labels */
    
    /* image containers */
    
    a.img, div.img			{ border: 1px solid #D9D4BD; background: #F1EEE0;}			/* default container with class="img" */
    a.img img, div.img img 	{ border: 1px solid #f3f3f3; }							/* inner image border for default container */
    a.imgHover				{ background-color: #E6E0C8; border-color: #C2BEAB; }	/* hover effect - container */
    a.img:hover img			{ border-color: #fff; }									/* hover effect - image */
    
    /* design structure */
    
    .pageTop			{ background-image: url("images/skins/skin-4/pageBg-top.png"); }		/* page top */
    .pageBottom			{ background-image: url("images/skins/skin-4/pageBg-bottom.png"); }	/* page bottom */
    #Header, .pageMain	{ background-image: url("images/skins/skin-4/pageBg-repeat.png; } /* repeating page graphic */
    
    
    #FooterTop			{ background-image: url("images/skins/skin-4/footerBg-top.png"); }	/* footer top */
    #FooterContent		{ background-image: url("images/skins/skin-4/footerBg-repeat.png"); }	/* repeating footer graphic */
    #FooterBottom		{ background-image: url("images/skins/skin-4/footerBg-bottom.png"); }	/* footer bottom */
    #Footer .one-third, #Footer .two-thirds, #Footer .half-page
    					{ background-image: url("images/skins/skin-4/footerBg-verticalRule.gif"); }	/* footer - content dividers */	
    #ContentPanel 		{ background: #4D4A45; } /* top reveal - hidden top content area */
    
    /* search */
    
    #Search { background-image: url("images/skins/skin-4/search-bg.gif"); }
    
    /* slide show - default, jQuery cycle plugin */
    
    #SlideTop		{ background-image: url("images/skins/skin-4/pageBg-slideTop.png"); }		/* top graphic for rounded corners */
    #SlideRepeat	{ background-image: url("images/skins/skin-4/pageBg-slideRepeat.png"); }	/* edges to create slide frame */
    #SlideBottom	{ background-image: url("images/skins/skin-4/pageBg-slideBottom.png"); }	/* bottom for curved border */
    #Slides			{ background: #FAFAF5; }	/* background color (should match page if using transparent images) */
    a.slidePrev, span#fancybox-left-ico		{ background-image: url("images/skins/skin-4/slide-previous.png"); }	/* previous slide button */
    a.slideNext, span#fancybox-right-ico		{ background-image: url("images/skins/skin-4/slide-next.png"); }		/* next slide button */
    #slidePager a, #slidePager a:visited	{ background-image: url("images/skins/skin-4/slide-pager.png"); }		/* jump to slide  */
    
    /* slide show - cu3er */
    
    #Slideshow-cu3er { background-image: url("images/skins/skin-4/pageBg-repeat.png");}	/* repeat background behind cu3er (not shadow) */
    	
    /* slide show - GalleryView */
    
    #SlideShow-GalleryView { background-image: url("images/skins/skin-4/pageBg-repeat.png");}
    #GalleryView .pointer { border-bottom-color: #FAFAF5; } /* up arrow color, should match page background color */
    
    /* ribbon elements (wrap around) */
    
    .ribbon .wrapAround	{ background-image: url("images/skins/skin-4/ribbon-wrap.png"); }	/* ribbon edge (wrap around, changes on scroll) */
    .ribbon .tab		{ background-image: url("images/skins/skin-4/ribbon.png"); }		/* ribbon main section */
    
    /* side navigation menu */
    
    .widget .sideNavWrapper	{ background-image: url("images/skins/skin-4/side-navigation-repeat.gif"); }			/* side navigation bakdground */
    .widget .sideNavBox-1	{ background-image: url("images/skins/skin-4/side-navigation-top.gif"); }				/* side navigation - top */	
    .widget .sideNavBox-2	{ background-image: url("images/skins/skin-4/side-navigation-bottom.gif"); }			/* side navigation - bottom */
    .widget ul li a, 
    .widget ul.sideNav li a	{ border-bottom: 1px dotted #DBDBDC; }													/* side navigation links - bottom border */
    .widget ul.sideNav li.currentPage, .widget ul.sideNav li.current-cat, .widget ul.sideNav li.current_page_item  	
    						{ background-image: url("images/skins/skin-4/side-navigation-active.gif"); }			/* side navigation - current page marker */
    .widget ul li.current_page_item a, widget ul.sideNav li.current_page_item a:link, 
    .widget ul.sideNav li.current_page_item a:visited, .widget ul.sideNav li.current_page_item a:hover, 
    .widget ul.sideNav li.current_page_item a:active, .widget ul li.current-cat a:link, .widget ul li.current-cat a:visited
    						{ color: #2C2C2C; }																		/* side navigation - current page link */
    widget ul.sideNav li.current_page_item a:link, .widget ul.sideNav li.current_page_item a:visited,
    .widget ul.sideNav li.current_page_item a:hover, .widget ul.sideNav li.current_page_item a:active
    						{ border-bottom: 1px solid #fff; }														/* side navigation - current page border bottom */
    
    /* quote */
    
    .quote 							{ background-image: url("images/skins/skin-4/quote-small-repeat.gif"); }	/* quote - background */
    .quote .quoteBox-1				{ background-image: url("images/skins/skin-4/quote-small-top.gif"); }		/* quote - top */
    .quote .quoteBox-1 .quoteBox-2	{ background-image: url("images/skins/skin-4/quote-small-bottom.gif"); }	/* quote - bottom */
    .quote p						{ color: #000; }	/* quote - text */
    .quoteAuthor p.name				{ color: #000; }	/* quote - author name */
    
    /* button styles */
    
    .btn		{ background-image: url("images/skins/skin-4/button-sprite.gif");}	/* button background - sliding doors side 1 */
    .btn span	{ background-image: url("images/skins/skin-4/button-sprite.gif"); 	/* button background - sliding doors side 2 */
    				  color: #E1E0DF;																/* text color */
    				  text-shadow: -1px -1px 2px #333;}												/* text shadow */
    .btn:hover span, .btnHover span { color: #fff; text-shadow: 1px 1px 1px #333; }	/* hover text */
    .darkBg .btn, .darkBg .btn span, #Footer .btn, #Footer .btn span, #ContentPanel .btn, #ContentPanel .btn span  { 
    	background-image: url("images/skins/skin-4/button-sprite-dark.gif"); }			/* buttons on dark backgrounds */
    	
    /* other */
    
    .hr { background-image: url("images/skins/skin-4/hr-bg.gif"); }
    
    div#fancybox-outer			{ background: #FAFAF5; } /* modal window background color */
    
    /* indent */
    
    .indent {text-indent: 2em;}
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Oct 2009
    Location
    Nebraska, USA
    Posts
    876
    Rep Power
    276
    please take the time to validate your code and fix any errors first, then, come back if you still need assistance.

IMN logo majestic logo threadwatch logo seochat tools logo