You are viewing limited content. For full access, please sign in.

Question

Question

Editing Form Titles with Css

asked on April 12, 2017 Show version history

Hello, as from the picture below, im trying to move the tabs to the yellow section and leave a blank space between the title and the tabs.

 Below is my css codes:

<style>
 #form-title-wrap {
      padding-left:0px;
      padding-right:0px
    }
 #cf-formtitle {
      height:230px;
      border-style:solid;
      background-color:#FFF ;
      border-color:#999999;
      background-image:url(http://banner.png);
      background-repeat:no-repeat;
      background-position: bottom;
      border-top-width:0;
      border-right-width:0;
      border-bottom-width:0;
      border-left-width:0
    }
 .cf-pagination-tabs li.active {
      color:#555555;
      font-family:Arial;
      font-style:normal;
      font-weight:bold;
      font-size:14px;
      text-decoration:none;
      border-color:#404040;
      border-style:solid;
      border-width:1px;
      border-bottom:none;
      background-color:#ffffff;
      vertical-align:bottom;
    }
 .cf-pagination-tabs li.active > a {line-height:14px}
 .cf-pagination-tabs li:not(.active) {color:#555555;font-family:Arial;font-style:normal;font-weight:normal;font-size:14px;text-decoration:none;border-color:#404040;border-style:solid;border-width:1px;border-bottom:none;background-color:#c0c0c0;vertical-align:bottom}
 .cf-pagination-tabs li:not(.active) > a {line-height:14px}
 .cf-pagination-bar {height:10px;border:1px solid #555555;background-color:#ffffff;}
 .cf-pagination-bar--title {color:#555555;font-family:Arial;font-style:normal;font-weight:normal;font-size:14px;text-decoration:none}
 .cf-pagination-bar--completed {background-color:#0069ba}
 .cf-pagination-bar--indicator {color:#555555;font-family:Arial;font-style:normal;font-weight:normal;font-size:14px;text-decoration:none}
 .cf-pagination-dropdown {color:#555555;font-family:Arial;font-style:normal;font-weight:normal;font-size:14px;text-decoration:none;border-color:#555555;border-style:solid;border-width:1px;background-color:#ffffff}
 body {
      background-color:#ffffff;background-image:url(http://background.png);
      background-repeat:no-repeat;
      background-attachment:fixed;
      background-position:center;
      background-size:100% 100%;
    }
</style>

 

When I change these values, the tabs don't move at all. Please help.

Sincerely.

0 0

Answer

SELECTED ANSWER
replied on April 13, 2017
.cf-pagination ul {margin-top:30px;}

You can change the 30px to a higher number to create more space between the tabs and the form title.

1 0

Replies

replied on April 13, 2017

Hi Blake, thank you it worked.

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.