Reduce horizontal spacing between the buttons

If you're a new user of AppGini, feel free to ask general usage questions, or look for answers here.
Post Reply
dlee
Veteran Member
Posts: 168
Joined: 2020-04-14 00:21
Location: South Carolina, USA
Contact:

Reduce horizontal spacing between the buttons

Post by dlee » 2025-01-22 06:17

I found the code below on one of the forums here, it was exactly what I needed. I failed to bookmark the post but whoever you are that posted it, THANK YOU. My new issue is how can I reduce the horizontal spacing between the buttons? Please see the attached screen capture.

Thanks,
TD

Code: Select all

input[type=radio] {
		display:none;
	}

	input[type=radio] + label{
		display:inline-block;
		margin:2px;
		padding: 4px 12px; 

		margin-bottom: 0;
		font-size: 14px;
		line-height: 20px;
		color: #333;
		text-align: center;
		text-shadow: 0 1px 1px rgba(255,255,255,0.75);
		vertical-align: middle;
		cursor: pointer;
		background-image: linear-gradient(to bottom,#fff,#e6e6e6);
		background-repeat: repeat-x;
		border: 1px solid #ccc;
		border-bottom-color: #b3b3b3;
	}

	input[type=radio]:checked + label{
		background-image: none;
		outline: 0;
		background-color:#2be52d;
	}
Attachments
button pic.jpg
button pic.jpg (95.18 KiB) Viewed 9451 times

saymaad
AppGini Super Hero
AppGini Super Hero
Posts: 56
Joined: 2024-06-03 16:17

Re: Reduce horizontal spacing between the buttons

Post by saymaad » 2025-01-22 06:32

Replace padding: 4px 12px; with padding: 4px 4px; and check the results, can be adjusted as per your preference.

dlee
Veteran Member
Posts: 168
Joined: 2020-04-14 00:21
Location: South Carolina, USA
Contact:

Re: Reduce horizontal spacing between the buttons

Post by dlee » 2025-01-22 06:42

Thanks for helping, the change only reduced the width of the buttons, not the space between the buttons.

TD

saymaad
AppGini Super Hero
AppGini Super Hero
Posts: 56
Joined: 2024-06-03 16:17

Re: Reduce horizontal spacing between the buttons

Post by saymaad » 2025-01-22 07:09

My bad, try and adjust:
margin-right: -10px;

dlee
Veteran Member
Posts: 168
Joined: 2020-04-14 00:21
Location: South Carolina, USA
Contact:

Re: Reduce horizontal spacing between the buttons

Post by dlee » 2025-01-23 04:49

My apologize for the delayed response. That resolved the issue, thank you !!!
TD

Post Reply