Title: How to style data elements
Last modified: May 3, 2017

---

# How to style data elements

 *  Resolved [john.cressman](https://wordpress.org/support/users/johncressman/)
 * (@johncressman)
 * [9 years, 1 month ago](https://wordpress.org/support/topic/how-to-style-data-elements/)
 * How do you style the individual elements in the breadcrumbs. I need a very specific
   look but I need to access the CSS for each element, but I can’t find exactly 
   how to access it or my css is being overwritten.
 * What’s the proper way of styling each element?
 * Thank you!

Viewing 2 replies - 1 through 2 (of 2 total)

 *  Plugin Author [John Havlik](https://wordpress.org/support/users/mtekk/)
 * (@mtekk)
 * [9 years, 1 month ago](https://wordpress.org/support/topic/how-to-style-data-elements/#post-9102435)
 * If you are using the recommended,and default settings for your breadcrumb templates,
   then each breadcrumb will be wrapped in `span` tags. You should be able to target
   them with the `.breadcrumbs span` CSS rule. Breadcrumb NavXT does not ship with
   any CSS, so styling is left completely to the theme. Thus, CSS styles need to
   be added to your theme’s (or child theme’s) style.css. If you are having issues
   getting CSS rules to apply, I suggest using your web browser’s built in inspector
   to help you diagnose what is going on.
 *  Thread Starter [john.cressman](https://wordpress.org/support/users/johncressman/)
 * (@johncressman)
 * [9 years, 1 month ago](https://wordpress.org/support/topic/how-to-style-data-elements/#post-9109850)
 * Thank you. I believe I’ve figured it out… and how to style the last item differently.
 *     ```
       .breadcrumbs a {
         border: 2px solid #000099; 
         border-radius: 5px;
         background: #000099; 
         color: #ffffff;  
         margin-top: 10px;   
         font-size: 20px;
       }
   
       .breadcrumbs a:hover {
         border: 2px solid #000099; 
         border-radius: 5px;
         background: #ffffff; 
         color: #000099;  
         margin-top: 10px;   
         font-size: 20px;
         text-decoration: none;
       }
   
       .breadcrumbs span:last-child a {
         border: 2px solid #000099; 
         border-radius: 5px;
         background: #ffffff; 
         color: #000099;  
         margin-top: 10px;   
         font-size: 20px;
         text-decoration: none;
       }
       ```
   
    -  This reply was modified 9 years, 1 month ago by [john.cressman](https://wordpress.org/support/users/johncressman/).

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘How to style data elements’ is closed to new replies.

 * ![](https://ps.w.org/breadcrumb-navxt/assets/icon.svg?rev=1927103)
 * [Breadcrumb NavXT](https://wordpress.org/plugins/breadcrumb-navxt/)
 * [Support Threads](https://wordpress.org/support/plugin/breadcrumb-navxt/)
 * [Active Topics](https://wordpress.org/support/plugin/breadcrumb-navxt/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/breadcrumb-navxt/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/breadcrumb-navxt/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [style](https://wordpress.org/support/topic-tag/style/)

 * 2 replies
 * 2 participants
 * Last reply from: [john.cressman](https://wordpress.org/support/users/johncressman/)
 * Last activity: [9 years, 1 month ago](https://wordpress.org/support/topic/how-to-style-data-elements/#post-9109850)
 * Status: resolved