Jump to content


Photo
- - - - -

custom css - trying to follow Nick build a site from .../theming video

custom css custom nav bacgrounds

This topic has been archived. This means that you cannot reply to this topic.
1 reply to this topic

#1 watchbill

watchbill

    Newbie

  • Members
  • 4 posts

Posted 29 December 2012 - 02:38 AM

I have followed Nick in the video he did showing how to make a site like Toms shoes... and all is cool until i got to the custom css navigation... I just can't seem to get it to work.. here is what it looks like he has in the video with my site info added.

 

Nick shows the custom code being pasted in at about 9:40 of the video

 

Any idea what where i am goofing up?  

I tried using single quotes in the image url without luck also

 

 

// Add background to navigation 
.navigation_wrap {background:url {"

Please Login or Register to see this Hidden Content

"} repeat-x;height:35px;}
 
 // change the height of the menu items, make them white and uppercase
.main_nav li a {line-height:1.5em;color:@white;text-transform:uppercase;}
 
// Add a background to the menu items
.main_nav li.current_page_item a, .main_nav li a:hover
{color:white;background:url {"

Please Login or Register to see this Hidden Content

"} repeat-x;}
 
    .page-id-38 {
    
    // remove the padding around the content box
    #contentbox .hentry-pad {padding:0;}
    
    // remove the padding around the features sections
    #quickslider .content-pad {padding-top:0;}
  
    // remove the padding around the content box
    #boxes .boxes-pad {padding-top:0;}
    
  
}


#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts

Posted 29 December 2012 - 03:10 AM

Nick would never, ever post CSS like this:

Please Login or Register to see this Hidden Content

Not only is it incorrect, it's dangerous to the stability of your site.

 

Each CSS element MUST have an element.  .page-id-XX is only one, and it's an indicator element.  An element is something like #boxes.

 

You can have .page-id-38 #boxes .boxes-pad {  then apply your operator (in this case, padding-top and the actual instruction, which is 0 pixels, written as 0 and ending with ;}

 

Each thing you want to do on page 38 MUST be accompanied by its own elements and operators.  You cannot merge them for the sake of convenience. 

 

From what you have above, there MUST BE three, distinct CSS entries each beginning with .page-id-38 followed by the elements you've cited. Please reference

Please Login or Register to see this Hidden Content

 

And kindly don't use videos as a source of code.  They are likely to be incorrect.  Written, reliable sources, such as that link, are the only ones worth trusting.