CSS help to add white space between tab buttons

HTML & CSS
1

Hello,

Could you please help me to add white space between tab buttons (pic attached)

I have tried many css combinations, yet so far no joy.

All help greatly appreciated,

My css code is:

   div#content div.options ul {
            height: 32px;
            border-left: 0px solid #E9E9E9;
            border-top-left-radius: 5px;
            list-style: none; }

            div#content div.options ul li {
                float: left;
                border: 2px solid #E9E9E9;
                border-width: 2px 2px 2px 2px; 
                border-top-left-radius: 7px;
                border-top-right-radius: 7px; }

                div#content div.options ul li a {
                    padding: 0px 8px;
                    display: block;
                    float: left;
                    font: 12px/32px arial, verdana, sans-serif;
                    color: #000000;
                    background: #E9E9E9 url('border.gif') repeat-x 2px 100%;
                    border-top-left-radius: 5px;
                    border-top-right-radius: 5px;
                    text-decoration: none; }

                    div#content div.options ul li a.active {
                        background: #ffffff; }

                    div#content div.options ul li a:hover {
                        background: #696969; 
                        font: 12px/32px arial, verdana, sans-serif;
                      color: #ffffff; }

2

We don’t have a website, or codepen, or HTML to go off of…but it LOOKS like a simple margin-right on here will suffice…

div#content div.options ul li
{
  margin-right:10px;
}

Just a guess since we don’t have hte ability to recreate this problem.

3

Hello RyanReese,

Yes that did it! Many thank yous for your help :smile:

Now the tabs are looking great, thank you again Ryan :slight_smile:

4

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