Change tab style

Posted in: Newspaper
Post count: 80
Pjump
#23139
Oct 2, 2014 at 6:20 pm

Hi,
There’s any way I can change the default style of the tabs of my website to match the style that I’ve create? The default is, for instance, the “PALAVRA AOS ASSOCIADOS” tab. The one I’ve created is the “OS NOSSOS PATROCINADORES”. I use the following CSS:

.separador-preto-sfundo {
	padding: 4px 10px 4px 0;
	margin: 0 0 20px 0;
	color: #333333;
	display: inline-block;
	background-color: transparent;
	position: relative;
	font-family: 'Roboto', sans-serif;
	border-bottom: 2px solid #4db2ec;
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 20px;
	margin-bottom: 20px;
}
.separador-preto-sfundo:before {
	content: '';
	position: absolute;
	height: 2px;
	top: 28px;
	left: 0px;
	background-color: #333333;
	width: 320px;
}
Post count: 6600
Lucian
#23177
Oct 3, 2014 at 9:18 am

Hi,

You can chose the title style 1 for the block titles then you would have to use less css to get it done as you like: http://screencast.com/t/w8yuWmjp
You can set the color/border/text align and so on.. as you like and adjust it using css, note though that if you set a color for the title from block editing panel you will not be able to overwrite it via css, best is to leave the settings default and add the color via css.

Here is the css I have used for this: 

.td_title_style_1 {
color: #000000;
border-bottom: 3px solid #000000 !important;
}

.block-title span  {
color: #000000 !important;
font-size: 15px;
font-weight: bold;
text-transform: uppercase;
line-height: 20px;
}

Hope this helps!

Thanks

  • This reply was modified 11 years by Lucian.
Post count: 80
Pjump
#23212
Oct 3, 2014 at 2:16 pm

Thanks Lucian.

Viewing 3 posts - 1 through 3 (of 3 total)
You must be logged in to reply to this topic.