MyBB Community Forums

Hello Friends,

I replaced all my buttons with css buttons. Now I have the problem that they aren't aligned correctly, and there is no space between the buttons.

Does anyone know why?

You have to add padding that the images must have held by default.

Use the css:

padding-left: 5px;

or

padding-right: 5px;

on the css stylesheet for the id, or under style.

for example, add this to your stylesheet

.post_buttons img {
padding-right: 5px;
}

I've added this to my global css, it doesn't work.

What is the website?

I am sorry. I just had a dumb moment. You removed the images and used links instead; SO I should have realized that the images were gone and you couldn't style them.

.post_buttons a:link {
padding-right: 5px;
}

should work.

I copied that into global css, it didn't work.
My css buttons do have the class called postbit.

Any ideas?

Are you sure you saved it, because I am checking the global.css and it hasn't appeared.

yeah, I hadn't noticed that. You can try using the class called postbit.

.postbit {
padding-right: 5px;
}

Change you .postbit class to this. The problem is the background css gradient, thats why the buttons getting stuck together. Just add the margin element and it will work fine. If you want lower space between buttons just lower px in margin.

.postbit {
	font-size: 14px;
	color: #ffffff;
	padding: 4px 4px;
	background: -moz-linear-gradient(
		top,
		#32a7fb 0%,
		#32a7fb 25%,
		#32a7fb);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#32a7fb),
		color-stop(0.25, #32a7fb),
		to(#32a7fb));
	-moz-border-radius: 0px;
	-moz-box-shadow:
		0px 3px 11px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(255,255,255,1);
	margin: 5px;
}

Thank you Sukanjan.K, this really helped me further. Now just one more question.

If you see this screenshot, on the very left end, the space is much shorter than on the very right side. Any ideas?