Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #27658


    I have built a custom button using css and it is displayed inside of an accordian using the theme’s shortcodes. for some reason, I cannot horizontally center the button and wonder if there is a conflict I can’t detect.

    here is the code in the HTML editor:

    [av_toggle_container initial='0' mode='accordian' sort='']
    [av_toggle title='Individual / Residential Membership' tags='']
    <p style="text-align: center;">This membership is perfect for local residents not representing any particular organization, but looking for a formal connection to the New Tampa business community.</p>
    <a class="jb" id="jb" title="Join the New Tampa Chamber of Commerce" href="http://#/">Join The Chamber </a>

    and here is my CSS:

    #jb {
    border-radius: 3px;
    padding: 10px;
    width: 18%;
    text-align: center;
    text-transform: uppercase;
    font-size: 14px;
    color: #ffffff;

    .jb {background: #52ac43;
    margin: 0 auto 0 auto;}

    .jb:hover {background: #52ac43;opacity: 0.8;}

    here is the link to the page where I am testing it:

    am I missing something? I want this button centered.



    Hi nheird

    You need to make the button display:block so that it can have the defined width and the margin trick will work.



Viewing 2 posts - 1 through 2 (of 2 total)

The topic ‘problem centering a css button inside of a toggle / accordian shortcode’ is closed to new replies.