4 replies to this topic

[danr]

Hi there,

I'm trying to figure out what I CSS I need to modify to move / align the tabber widget tabs themselves (i.e. not their content)? As you can see from this site I've been working on blacklabeltransfers.com.au, because I'm using "border-radius", I've got an overhang that I would like to eliminate.

Many thanks!

Dan

[Sridhar Katakam]

Why not make the left corner not rounded?

Use this CSS:

.custom .tabber-widget-rounded-light .tabber-widget-content {
 -moz-border-radius:0px 7px 7px;
 -webkit-border-radius:0px 7px 7px 7px;
 border-radius:0px 7px 7px;
}

[danr]

Hi Sridhar,

Thanks for the quick reply. Unfortunately due to a cross browser issue, I can't specify long hand border radius, only short (I'm using CSS3 PIE to replicate border-radius in older versions of Internet Explorer; support notes here: http://css3pie.com/documentation/supported-css3-features/), otherwise that's probably what I would have done!

Is there no containing element of the tabs that would allow for the alignment I'm after?

Thanks for your help

Dan

[Sridhar Katakam]

Quote

Is there no containing element of the tabs that would allow for the alignment I'm after?

Yes, there is.

Edit http://blacklabeltransfers.com.au/wp-content/plugins/tabber-widget/templates/rounded-light.css

Set a left margin in

.tabber-widget-rounded-light ul.tabber-widget-tabs {
 list-style-type: none;
 padding: 0 !important;
 margin: 0 !important;
}

[danr]

Hi Sridhar,

Thanks for your suggestion, looks like that's fixed it. The tabs sit much better now!

Cheers

Dan