Jump to content


Photo
- - - - -

site not responding to CSS

css unresponsive broken cache

  • Please log in to reply
8 replies to this topic

#1 akakjb

akakjb

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 20 May 2013 - 06:30 PM

I have recently re-CSS'd my site to be more responsive. I have also been messing with stylized features that I could add to the site to make it a bit more appealing. I have 3 boxes underneath the quickslider of my site used as sub navigation. they are RESCUE, RECOVERY, and RESTORATION. Originally these were red, green and blue (in the same order). This was done with CSS to color them and make them larger than normal "a" links. I removed the code with command+X and inputed new code in to try a different effect. It wasn't working. I then deleted the new code and hit command+V to paste back in the old code. it didn't take. Now I can't get the box titles to respond at all to any code. I check the title with "Inspect Element" in Chrome and the CSS doesn't even show up as incorrect or not taken in the CSS panel. It just isn't there. I have correctly opened and closed the CSS commands but still nothing. Here is the CSS I originally used

 

 

div#fbox_3285.fbox h3 {
  font-size:36px;
  color:#b7001f;
}
 
div#fbox_3283.fbox h3 {
  font-size:36px;
  color:#506e1f;
}
 
div#fbox_3281.fbox h3 {
  font-size:36px;
  color:#032e55;
}

 

I already tried adding a more specific tag to the div by adding ".fboxtitle" before "h3" and that didn't work either.

 

Please help!

 

Please Login or Register to see this Hidden Content

 

-James



#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 20 May 2013 - 06:48 PM

Hi,

 

Was there any other CSS?



#3 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 20 May 2013 - 06:54 PM

James, the good thing is that your CSS is perfectly valid.



#4 akakjb

akakjb

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 20 May 2013 - 06:55 PM

Here is all my css copied from the pagelines CSS/LESS Rules

 

body{}
 
/* - - - - - - F O N T  E M B E D - - - - - - */
@font-face {  
          font-family: "NationalBold";  
          src: url(

Please Login or Register to see this Hidden Content

); /* IE */  
    src: url(

Please Login or Register to see this Hidden Content

) format('embedded-opentype'), /* IE6-IE8 */ 
               url(

Please Login or Register to see this Hidden Content

) format('truetype'); /* non-IE */  
  } 
 
  .NationalBold { font-family: "NationalBold", verdana, helvetica, sans-serif;  
  } 
 
/* - - - - - - - - */
 
@font-face {  
    font-family: "NationalBook";  
    src: url(

Please Login or Register to see this Hidden Content

); /* IE */  
    src: url(

Please Login or Register to see this Hidden Content

) format('embedded-opentype'), /* IE6-IE8 */ 
         url(

Please Login or Register to see this Hidden Content

) format("truetype"); /* non-IE */  
  } 
 
.NationalBook { font-family: NationalBook, verdana, helvetica, sans-serif;  
  } 
 
/* - - - - - - - - */
 
@font-face {  
    font-family: "Yank";  
    src: url(

Please Login or Register to see this Hidden Content

); /* IE */  
    src: url(

Please Login or Register to see this Hidden Content

) format('embedded-opentype'), /* IE6-IE8 */ 
               url(

Please Login or Register to see this Hidden Content

) format("truetype"); /* non-IE */  
  } 
 
.Yank { font-family: Yank, verdana, helvetica, sans-serif;  
  } 
 
/* - - - - - - - - */
 
@font-face {  
    font-family: "NationalItalic";  
    src: url(

Please Login or Register to see this Hidden Content

); /* IE */  
    src: url(

Please Login or Register to see this Hidden Content

) format('embedded-opentype'), /* IE6-IE8 */ 
               url(

Please Login or Register to see this Hidden Content

) format("truetype"); /* non-IE */  
  } 
 
.NationalItalic { font-family: NationalItalic, verdana, helvetica, sans-serif;  
  } 
 
/* - - - - - - - - */
 
 
 
 
/* - - - - - - - - - - - H E A D E R - - - - - - - - - - - */
 
 
/* - G L O B A L - */
 
p {
  color:#333333;
  font-family:NationalBook;
  font-size:18px;
}
 
a {
  color:#032e55;
  text-decoration:none !important;
  font-family:"NationalBold";
  font-size:18px;
  -o-transition:color .3s ease-out, background .2s ease-in;
  -ms-transition:color .3s ease-out, background .2s ease-in;
  -moz-transition:color .3s ease-out, background .2s ease-in;
  -webkit-transition:color .3s ease-out, background .2s ease-in;
  /* ...and now override with proper CSS property */
  transition:color .3s ease-out, background .2s ease-in;
}
 
a:hover {
  color:#b7001f;
}
 
h2 a {
  color:#032e55 !important;
  text-decoration:none !important;
  font-family:"NationalBold";
  font-size:36px;
  -o-transition:color .3s ease-out, background .2s ease-in;
  -ms-transition:color .3s ease-out, background .2s ease-in;
  -moz-transition:color .3s ease-out, background .2s ease-in;
  -webkit-transition:color .3s ease-out, background .2s ease-in;
  /* ...and now override with proper CSS property */
  transition:color .3s ease-out, background .2s ease-in;
}
 
h2 a:hover {
  color:#b7001f !important;
}
 
a img {
  opacity:1;
 -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
 
a img:hover {
  opacity:.7;
  -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
 
h4 {
  font-family:"NationalBold";
  font-size:24px;
  color:#3c2c04;
}
 
.alignleft {
  margin-bottom: 0em !important;
  margin-right: 1em !important;
}
  
 
/* - N A V B A R - */
 
div.navbar.fix.navbar-content-width.pl-color-black-trans {
  background: transparent !important;
  box-shadow:none !important;
  border:none !important;
}
 
div.navbar.fix.navbar-content-width.pl-color-black-trans {
   background: none !important;
   moz-box-shadow: none !important;   
   -webkit-box-shadow: none !important;   
   box-shadow: none !important;
   border: none !important;
   filter: none !important;
}
 
ul#menu-quick-nav.font-sub.navline.pldrop.pull-right a {
  color:#d8d5cd;
  font-family:Yank;
  font-size:16px;
  font-weight:100;
  text-shadow:none !important;
}
 
ul#menu-quick-nav.font-sub.navline.pldrop.pull-right a:hover {
  color:#b1ab9c;
}
 
/* - B R A N D N A V - */
 
img.mainlogo-img {
  opacity:1;
}
 
img.mainlogo-img:hover {
  opacity:.8;
}
 
a.plbrand.mainlogo-link {
  padding-right:0% !important;
  position:relative !important;
}
 
li#menu-item-3230.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-3230 img {
  opacity:1;
}
 
li#menu-item-3230.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-3230 a {
  position:relative;
  bottom:17px;
}
 
section#brandnav.container.clone_1.section-brandnav.fix .content-pad {
  padding-top:0em !important;
  padding-bottom:0em !important;
}
 
div.brandnav-nav.main_nav.fix {
  position:relative !important;
  top:89px;
  margin-left:0px !important;
}
 
div.brandnav-nav.main_nav.fix a#mobile-menu-trigger {
  position:relative;
  top:-89px !important;
}
 
div.brandnav-nav.main_nav.fix a#mobile-menu-trigger div.brandnav-nav.main_nav.fix {
  position:relative;
  top:-89px !important;
}
 
div.brandnav-nav.main_nav.fix a {
  -o-transition:color .4s ease-out, background .3s ease-in;
  -ms-transition:color .4s ease-out, background .3s ease-in;
  -moz-transition:color .4s ease-out, background .3s ease-in;
  -webkit-transition:color .4s ease-out, background .3s ease-in;
  /* ...and now override with proper CSS property */
  transition:color .4s ease-out, background .3s ease-in;
  font-size:20px;
  font-family:NationalBold;
  letter-spacing:1px;
}
 
div.brandnav-nav.main_nav.fix a:hover {
  background:#ebeae6 !important;
}
  
  
div.brandnav-nav.main_nav.fix ul.sub-menu a {
  font-family:NationalBook;
}
 
div.brandnav-nav.main_nav.fix ul.sub-menu a:hover {
  background:#d8d5cd !important;
}
 
 
/* - H I G H L I G H T - */
 
section#highlight.container.clone_1.section-highlight.fix .content-pad {
  padding-top:0em !important;
  padding-bottom:0em !important;
}
  
  /* - - - - - - - - - - - C O N T E N T - - - - - - - - - - - */
 
  
/* - T I T L E S - */
  
hgroup.post-title.fix h1.entry-title.pagetitle {
  font-family:"NationalItalic" !important;
  font-size:48px !important;
  letter-spacing:10px;
  color:#9d8b73;
  font-weight:100;
  
section.bd.post-title-section.fix h1.entry-title {
  font-family:"NationalItalic" !important;
  font-size:48px !important;
  letter-spacing:3px;
  color:#9d8b73;
  font-weight:100;
}
 
div.streamer.text {
  font-family:"NationalBold" !important;
  font-size:24px !important;
  font-style:none !important;
  text-transform:none !important;
}
 
h3.hungryfeed_feed_title {
  display:none !important;
}
 
 
/* - H I G H L I G H T - */
 
 
 
 
/* - q u i c k s l i d e r - */
 
div.fslider img {
  opacity:1;
}
 
 
 
/* - B O X E S - */
  
.grid-element.pp4.img_grid {
  margin-bottom:0px !important;
}
 
div#fbox_3285.fbox h3 {
  font-size:36px;
  color:#b7001f;
}
 
div#fbox_3283.fbox h3 {
  font-size:36px;
  color:#506e1f;
}
 
div#fbox_3281.fbox h3 {
  font-size:36px;
  color:#032e55;
}
 
div#fbox_3285.fbox h3:hover {
  color:#032e55 !important;
}
 
div#fbox_3283.fbox h3:hover {
  color:#3c2c04 !important;
}
 
div#fbox_3281.fbox h3:hover {
  color:#b7001f !important;
}
 
div#fbox_3279.fbox img {
  border-radius:0px;
  box-shadow:none;
}
 
div#fbox_3277.fbox img {
  border-radius:0px;
  box-shadow:none;
}
 
div#fbox_3275.fbox img {
  border-radius:0px;
  box-shadow:none;
}
 
div#fbox_3273.fbox img {
  border-radius:0px;
  box-shadow:none;
}
 
/* - F A C E B O O K - */
 
div.pluginSkinLight ._4s7c {
border: none !important;
border-top-color: transparent !important;
}
 
  
/* - P O S T S - */
 
 
/* - I M P A C T  P A R T N E R S - */
/*
table#impact-table {
  max-width:99% !important;
   height:auto !important;
}
 
td#impact-1 {
  opacity:.75;
  max-width:241px !important;
  vertical-align:bottom !important;
  padding: 0em !important;
  -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
 
 
td#impact-1:hover {
  opacity:1;
    max-width:241px !important;
-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
 
#impact-image-1:hover + #impact-text-1 {
  display:block !important;
}
 
td#impact-2 {
  opacity:.75;
 
    max-width:220px !important;
    vertical-align:bottom !important;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
 
td#impact-2:hover {
  opacity:1;
     max-width:220px !important;
-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
 
td#impact-3 {
  opacity:.75;
  max-width:188px !important;
    vertical-align:bottom !important;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
 
td#impact-3:hover {
  opacity:1;
    max-width:188px !important;
-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
 
td#impact-4 {
  opacity:.75;
  max-width:205px !important;
    vertical-align:bottom !important;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
 
td#impact-4:hover {
  opacity:1;
    max-width:205px !important;
-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
 
td#impact-5 {
  opacity:.75;
  max-width:190px !important;
    vertical-align:bottom !important;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
 
td#impact-5:hover {
  opacity:1;
    max-width:190px !important;
-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
 
td#impact-6 {
  opacity:.75;
  max-width:176px !important;
    vertical-align:bottom !important;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
 
td#impact-6:hover {
  opacity:1;
    max-width:176px !important;
-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
*/
 
  /* - - - - - - - - - - - F O O T E R - - - - - - - - - - - */
 
/* - M O R E F O O T - */
 
body.home SECTION#morefoot.container.clone_1.section-morefoot.fix {
   display:none !important;
}
 
div#nav_menu-2.widget_nav_menu.widget.fix h3 {
  font-size:20px;
  color:#b7001f;
  font-family:"NationalBold";
  text-transform:uppercase;
}
 
div#nav_menu-3.widget_nav_menu.widget.fix h3 {
  font-size:20px;
  color:#506e18;
  font-family:"NationalBold";
  text-transform:uppercase;
}
 
div#nav_menu-4.widget_nav_menu.widget.fix h3 {
  font-size:20px;
  color:#002d54;
  font-family:"NationalBold";
  text-transform:uppercase;
}
 
section#sb_footcols.container.clone_1.section-sb_footcols.fix p {
  color:#999999;
}


#5 James B

James B

    Advocate

  • Moderators
  • 4983 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 20 May 2013 - 07:34 PM

Hi there, its because the styling for the a tag is overriding it. If you add an a to the end of your code it should work -

Please Login or Register to see this Hidden Content

 

Please Login or Register to see this Hidden Content



#6 akakjb

akakjb

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 20 May 2013 - 07:57 PM

Hi there,

     I have tried adding the "a" and I have also tried including !important. None of it works.

 

-James



#7 akakjb

akakjb

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 20 May 2013 - 08:05 PM

Alright, so I just tried again. This time the CSS went through. I don't believe at all it was because of not inputing the correct tag, I have tried adding "a" and "!important" to the css several times yesterday and today before I posted to the forum. The CSS seems to be cached and won't reset for a period of hours before it applies new styling. I don't have any caching plugins active, so my theory is that the lag is from Pagelines. I have had things like this happen multiple times in the past. Is there a way to reduce/eliminate this lag?

 

-James



#8 akakjb

akakjb

    Member

  • Members
  • 11 posts
  • Country: Country Flag

Posted 20 May 2013 - 08:08 PM

For Example

 

div#fbox_3285.fbox h3 a:hover {
  color:#032e55 !important;
}
 
div#fbox_3283.fbox h3 a:hover {
  color:#3c2c04 !important;
}
 
div#fbox_3281.fbox h3 a:hover {
  color:#b7001f !important;
}

 

 

This code has been in the CSS since Saturday at about 11pm. I added it but it would not work. I just updated the tags on the css back to this original CSS (there were several variations along the way) and voila! it works. Super frustrating.



#9 James B

James B

    Advocate

  • Moderators
  • 4983 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 20 May 2013 - 11:38 PM

So all working now?







Also tagged with one or more of these keywords: css, unresponsive, broken, cache