I just try shareholic plugin, but it doesn't appear with the full size icon share, just 1/3, Is there any way to fix it?

I change to another and it become normal again with a full size icon, so that I think the problem is about this theme, can we fix it ?

what is the url pointing to the issue?

I change to another and it become normal again

'another' what? theme? plugin? host? site?

sr, I forgot : http://quotesaboutbeinghappy.us/prim...happy-couples/

I change to another theme and it normal again, but with monte zuma it just appear 1/3 the icon , you can see the list icon share below :" sharing is caring "

The problem is not really with Montezuma. The problem is that Shareaholic doesn't make its CSS specific enough, so their CSS clashes with Montezuma's CSS. It's been covered in this thread as well as this thread. Both Montezuma and Shareaholic use the italics tag (<i>) for their icons. The reason why you don't see the problem with other social plugins is that they probably don't use the italics tag for their icons, or their CSS is more specific. And you don't see the problem with other themes because other themes probably don't use the italics tag for displaying icons. Is Montezuma wrong for using the italics tag in a non-standard way? I don't think you can say that, because Shareaholic is using it in the exact same way, and that's where the problem occurs.

In my opinion, it's up to plugin developers to make their CSS as specific as possible, because 1) theme developers should make their CSS simple enough for others (web developers and plugin developers) to override/customize, and 2) theme developers can't anticipate all the different ways that a plugin developer may use a particular element. All Shareaholic had to do was include the Shareaholic classes in it's CSS selectors and there wouldn't be a problem with any theme (or any other plugin), but instead they made their selectors too general.

[Edited]: I tried to look at your site to see if I could give you some CSS to fix your problem, but for some reason I keep having problems loading it.

[Edit2]: @truelight, I was able to finally access your site. If you follow what I did in my next post below and copy the new CSS rule to the bottom of your various.css virtual CSS file, that should fix your Shareaholic problem as well, even though you are using a different button layout than I am.

Here's some clarification regarding Shareaholic's CSS.

I installed Shareaholic on my Montezuma test site, and here is what the icons looked like initially:



As you can see, they were very small and illegible.

This is the rule for Shareaholic's icons:

i.shareaholic-service-icon {
background-image: url("//dsms0mj1bbhn4.cloudfront.net/assets/pub/share-buttons/classic-etc.png");
background-position: 0 0;
background-repeat: no-repeat;
display: block;
position: relative;
width: 40px;
height: 40px;
border-radius: 4px;
}

It's a very general rule that lays out the formatting for Shareaholic icons, which use the HTML italics tag (<i>) to display its icons.

This is the rule for Montezuma's icons:

.hentry ul li i, .comment-text ul li i {
display: inline-block;
width: 12px;
height: 12px;
margin-right: 10px;
margin-left: -20px;
background: transparent url(http://montezuma.inrgee.com/wp-content/themes/montezuma/images/icons.png) -48px -84px no-repeat;
}

Again, this rule is a fairly general rule for icons which are used in a list within the post contents. And Montezuma also uses the HTML italics tag to display icons! Notice that both sets of rules include property values for width and height. For Montezuma, the rule sets the height and width at 12px; for Shareaholic, the icons are set to 40px high and wide.

So that's the crux of the problem: Both the theme and the plugin coincidentally use the italics tag in a somewhat non-standard way for displaying icons, and because Shareahlolic puts its buttons inside a list structure, it's going to match the Montezuma rule. So which rule comes into effect? Because the Montezuma selector of .hentry ul li i has a higher specificity than the Shareaholic selector of i.shareaholic-service-icon (13 vs. 11), the browser will use any properties which are in common from the Montezuma rule. That's why the width & height end up to be 12px square.

So what can be done about it? We can create a rule for the Shareaholic icons that has a selector with an equal or higher specificity than the Montezuma selector, and reset those common properties back to their original values. Here's the original Shareaholic CSS rule that's been slightly modified:

.shareaholic-canvas i.shareaholic-service-icon {
	background-image: url("//dsms0mj1bbhn4.cloudfront.net/assets/pub/share-buttons/classic-etc.png");
	background-position: 0 0;
	background-repeat: no-repeat;
	display: block;
	position: relative;
	width: 40px;
	height: 40px;
	border-radius: 4px;
	margin: 0px;
}

This rule is basically the same default rule for the Shareaholic icon, but I added the .shareaholic-canvas class at the front of the selector because the buttons are contained in a <div> with that class. Now the specificity value is 21, which means its properties will override any identical properties that were in the Montezuma rule. I also added the margin property at the end because the Montezuma rule had also overridden another Shareaholic rule for .shareaholic-ui i, which sets the margin around the icons to 0.

After adding the new rule to the end of my various.css virtual file, here's how the Shareaholic buttons now look:



You can also see the Shareaholic buttons at the bottom of any post on my test site.

So I hope that clarifies what the problem is between Shareaholic and Montezuma. Shareaholic could have saved a lot of trouble by adding the .shareaholic-canvas class to the front of its CSS selector in the first place, since I would think that all Shareaholic buttons would be contained in that container. But there was no way for the Shareaholic developers to know that a theme (or even another plugin) would be using the italics tag for displaying icons, and the Montezuma developer could likewise not anticipate that plugin developers would use the italics tag for displaying graphical images. For those who may think that Montezuma is somehow broken and needs to be fixed, you would be equally justified in complaining on the Shareaholic support forum about why their plugin doesn't work with Montezuma when other Social plugins do. It's not a matter of one thing being broken and the other one not, but finding a way to make two pieces that do work, work together.

Dear, there was some problem after I add the code to my various.css. I attached the image, The icon don't change to normal

did you forget to press 'SAVE' beczause that CSS is not in your css file

	margin-bottom:			0;
}
.credit-link a {
	color:					#aaaaaa;
	font-weight:			bold;
	text-decoration: 		none;
}

  <<<<<<<=======missing

.sub-menu:before, .sub-menu:after,
.cf:before, .cf:after,
.row:before, .row:after,
.row20:before, .row20:after,
.row:before, .row:after,
.row:before, .row:after,
.row:before, .row:after,
.lw:before, .lw:after {
  	content: "."; 
  	display: block; 
  	height: 0; 
  	clear: both; 
  	visibility: hidden;
	}

Did you remember to click the Save Changes button? Because when I look at your CSS, I don't see the new rule in there.

[edited]: Oops, Juggledad beat me to it.

I'm so sorry , I forgot to click save, thank you everyone, I worked , I'm really like it