[skill] shortcode doesn’t seem to work correctly

[jimbojones]

Hi there,

I’m trying to add the [skills] shortcode into a post as used in your example, however it appears to be going wrong (formatting wise)

I’ve pasted the example using the Text mode in the post editor in WordPress.

[skills]
[skill title=”Dreamwaver” percent=”100%” hide_percent=0 text=”Instead of Percent”]
[skill title=”Photoshop” percent=”80%”]
[skill title=”illustrator” percent=”60%”]
[skill title=”HTML5″ percent=”70%”]
[skill title=”jQuery” percent=”50%”]
[/skills]

I’ve attached a image grab of what happens when I try to use the shortcode

http://postimg.org/image/uw8hmffmf/

Notice the first bar is too long, each bar seems to get a bullet mark added to it.

Any ideas whats going on?

[FocuxTheme Support]

Hi, sorry for the delay.
What’s the browser you used? And Can you tell me your website link, I wanna check on my computer.

[jimbojones]

Sure I’ve tried in Chrome and IE9.

Using the oldcar 1.3 with no changes, default wordpress site install

Example page is here:

http://wordpresstest.202010.co.uk/?p=1

Notice the list style bullet points and also the percentage bars aren’t quite right. I’m guessing an issue in the css files?

[FocuxTheme Support]

Hi

I see, this is a small bug of CSS, I will improve it in next version, and tell you a quick solution, put the following CSS into “OldCar options > custom code > custom css”

.skills{overflow:hidden;}

[jimbojones]

Ah excellent, Thanks Johnny. That’s fixed the bullet points showing up.

Oddly the percentages or width of the bars doesn’t look right?
I looks like the bar isn’t quite calbirated right.

I’ve updated the site with the above custom.css and adding some more bars to show the issue. Notice that 10% is too big and 90% is too far over.

Sorry to be a pain, but its a lovely shortcode idea.

James.

[jimbojones]

Is it something to do with cell padding maybe?

[FocuxTheme Support]

Yes, it’s caused by padding
Put the following css to custom CSS

.skills li span{
   text-indent:10px;
   padding:5px 0 6px;
}

[jimbojones]

Thanks Johnny, all sorted. You rock!

[FocuxTheme Support]

It’s my pleasure!

[Author]

Posts