Pill Style Inputs on Foundation Forms

Does anyone know how to radius the edges on the input areas in a Foundation form? I’d like them to be a pill, but can’t get it to work.

I gave each input a class of pill and used:

.pill {
border-radius: 16px;

My project is here: https://one11sandbox.com/sspros/

Try this:

.pill input {
    border-radius: 16px !important;
    padding-left: 12px;

The left padding is to align the text in the box a bit. You can adjust to your liking.

YOU ROCK!!! Thank you, it looks fantastic!!

A border-radius of 50% would be better…

ok, Thanks @joeworkman

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.