border on tab navigation – Themeco Community

border on tab navigation

Corinne J — Fri, 15 Aug 2014 21:51:22 +0000

I have tried the fixes requested by others in the forum and nothing is getting rid of my borders as seen here:

http://03a2db5.netsolhost.com/wordpress2/services/

I’m attempting at getting my tab navigation to resemble this:

http://www.insperity.com/products/financial-solutions

Reply To: border on tab navigation

Nabeel A — Fri, 15 Aug 2014 22:31:56 +0000

Hey Corinne,

To remove the tab borders Add this code via Appearance > Customize > Custom > CSS:

.x-nav-tabs > .active > a, .x-nav-tabs > .active > a:hover {
-webkit-box-shadow: none !important;
box-shadow: none !important;
}

Let us know how this goes!

Reply To: border on tab navigation

Corinne J — Fri, 15 Aug 2014 23:42:37 +0000

Hi! This removed the red color which was actually the only component that i liked… borders and shadow effect remain.

Reply To: border on tab navigation

Rad — Sat, 16 Aug 2014 00:04:35 +0000

Hi Corinne,

How about this.

.x-tab-content {
-webkit-box-shadow: none !important;
box-shadow: none !important;
border: 0px !important;
}

And if you wish to remove tab navs border too, then use this.

.x-nav-tabs>li {
border: 0px !important;
}
.x-nav-tabs {
-webkit-box-shadow: none !important;
box-shadow: none !important;
border: 0px !important;
}

Hope these helps.

Reply To: border on tab navigation

Corinne J — Sat, 16 Aug 2014 00:11:17 +0000

Awesome – I’m going to give these a try shortly. I’m kind of digging the last solution you provided, however. That said, one of my other challenges which is coming back in the tab nav that is elsewhere on the site is the gap created when using h tags. You can check it out with the dummy text placed here:

http://03a2db5.netsolhost.com/wordpress2/services/

How do we tighten up this space? So odd that it only occurs when using these and other style tags.

Reply To: border on tab navigation

Rad — Sat, 16 Aug 2014 00:16:25 +0000

Hi Corinne,

You could add mtn to your head titles. This will remove large spacing above your text.

Eg.

Thanks!

Reply To: border on tab navigation

Corinne J — Sat, 16 Aug 2014 00:26:58 +0000

Benefits

removes my title altogether for some reason… leaves nav bar with ‘Make Sure to Set a Title’ after several attempts.

Reply To: border on tab navigation

Rad — Sat, 16 Aug 2014 00:31:58 +0000

Hmm, that’s weird. Would you mind posting your shortcodes here.

Thank you.

Reply To: border on tab navigation

Corinne J — Sat, 16 Aug 2014 15:05:23 +0000

Sorry… dumb question – how do I get to my short codes? Here is everything I have in my customizer css if that is what you mean?:

.wpcf7-form {
background:#cccccc;
border-radius:7px;
padding: 10px 20px;
margin-bottom:10px;
}
input[type=”radio”] {
margin-right: 2px;
margin-left: 8px;
}
label {
margin-left: -3px;
}

.x-topbar .p-info a {
border-bottom: none;
}

hr { display: block; height: 1px;
border: 0; border-top: 1px solid #000000;
margin: 1em 0; padding: 0; }

.entry-content {
margin-top: 2px;
}

.x-accordion-heading .x-accordion-toggle{
color:red; /*changes the color of the accordion heading*/
background-color: #000000!important;
}

.x-accordion-heading .x-accordion-toggle {
color:ffffff
}

.x-nav-tabs > .active > a, .x-nav-tabs > .active > a:hover {
-webkit-box-shadow: none !important;
box-shadow: none !important;
}

Reply To: border on tab navigation

Christopher — Sat, 16 Aug 2014 15:38:27 +0000

Hi there,

The short codes are those one you add in posts or pages using visual composer.now if you click to view in classic mode you can see those codes.

Hop it helps.