Support Forums
[TUT] How to round up Labrocca's Tabbed Menu tabs. - Printable Version

+- Support Forums (http://www.supportforums.net)
+-- Forum: Categories (http://www.supportforums.net/forumdisplay.php?fid=87)
+--- Forum: Webmaster Support (http://www.supportforums.net/forumdisplay.php?fid=36)
+---- Forum: Forum Software Help (http://www.supportforums.net/forumdisplay.php?fid=49)
+---- Thread: [TUT] How to round up Labrocca's Tabbed Menu tabs. (/showthread.php?tid=27537)



[TUT] How to round up Labrocca's Tabbed Menu tabs. - Sick - 12-29-2012

[TUT] How to round up Labrocca's Tabbed Menu tabs.

This will make your tab's look like this:
[Image: 5d634789dff8af78734cd8cb541f1005.png?1356789532]

Go to Templates & Style>Themes> Click (your theme)>Tabbed.css.
Click the tab saying ''Edit Sheet: Advanced Mode''
Look for where it says

Code:
background: white url(images/thead_bg.gif) top left repeat-x;

Under the css called .shadetabs li a{
Under that copy and paste the next code:

Code:
-moz-border-radius-topleft: 6px;
-moz-border-radius-topright: 6px;
-webkit-border-top-left-radius: 6px;
-webkit-border-top-right-radius: 6px;

Click on ''Save Changes'' and look at the difference!
I hope this tutorial helped people that didn't know how to do this.

P.S. If you want to round the tabs up even more (or less) change the ''6'' in ''6px'' higher or lower.

ENJOY



RE: [TUT] How to round up Labrocca's Tabbed Menu tabs. - common thief - 12-30-2012

Omg it looks so sexy now! thanks dude


RE: [TUT] How to round up Labrocca's Tabbed Menu tabs. - Sick - 12-31-2012

(12-30-2012, 03:53 PM)common thief Wrote: Omg it looks so sexy now! thanks dude

No problem, enjoy!


RE: [TUT] How to round up Labrocca's Tabbed Menu tabs. - TheArmyKid - 04-08-2013

Hmm i done something wrong?

Code:
.shadetabs{
padding: 3px 0;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 12px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.shadetabs li{
display: inline;
margin: 0;
}

.shadetabs li a{
-moz-border-radius-topleft: 6px;
-moz-border-radius-topright: 6px;
-webkit-border-top-left-radius: 6px;
-webkit-border-top-right-radius: 6px;
text-decoration: none;
position: relative;
z-index: 1;
padding: 3px 7px;
margin-right: 3px;
border: 1px solid #778;
color: #ffffff;
background: white url(images/thead_bg.gif) top left repeat-x;
}

.shadetabs li a:hover{
text-decoration: underline;
}


.shadetabs li a.selected{ /*selected main tab style */
position: relative;
top: 1px;
}

.shadetabs li a.selected{ /*selected main tab style */
background:#ADCBE7;
color: #000000;
border-bottom-color: #81A2C4;
}

.shadetabs li a.selected:hover{ /*selected main tab style */
text-decoration: none;
}

.tabcontent{
display:none;
}

@media print {
.tabcontent {
display:block !important;
}
}

thats what i did and didn't see any changes


RE: [TUT] How to round up Labrocca's Tabbed Menu tabs. - robbygensic - 04-15-2013

thanks for the codes direction ,they re great