ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Dante
• June 2, 2017 at 1:50 pm #326793
  jbensous

  Member

  Post count: 13

  I tried using a few methods in here to resolve my bulleted list alignment problem. Presently I have both of these in my custom CSS theme area:

  .box-content-wrap ul li {
  padding-left: 0.7em;
  text-indent: -1.3em;
  }

  .spb_text_column ul, .box-content-wrap ul {
  list-style: disc outside none !important;
  }

  Now my “regular” bullets are aligning properly. However, whenever I use your shortcode to create lists that have the font awesome or SS icons … it adds a disc bullet in front of the font awesome or ss list icon so there are now two bullets in each list item. I am tasked with getting this site live by Monday. What can I do to fix this problem?

  Thanks a bunch!

  Attachments:

  You must be logged in to view attached files.
  June 5, 2017 at 6:45 pm #327033
  David Martin – Support

  Moderator

  Post count: 20834

  I cannot see your page without a login, guessing it’s not published.

  Please create a test page with both list items so we can see the issue. Please also remove the custom CSS so we can properly address this issue.

  Thanks.

  June 5, 2017 at 7:06 pm #327043
  jbensous

  Member

  Post count: 13

  Hi,

  Here is updated link (we just pointed domain yesterday): http://www.5nine.com/5nine-manager/

  I removed the CSS code. What I am trying to do is have the copy align properly for the bullets. I found CSS code to align it in another post, but when I used it – it did align the copy to the right of the bullet – however, it added an additional bullet to the left of the list icons and it pushed the actual list bullets to the left of the entire copy block. How can I get the copy to line up properly for both the regular ul / li bullets as well as the shortcode list fa/ss icons lists?

  Thanks!

  June 7, 2017 at 2:32 pm #327428
  David Martin – Support

  Moderator

  Post count: 20834

  Thanks, please test this CSS:

  .sf-list li span {
      display: block;
      max-width: 100%;
      margin-left: 15px;
  }
  .sf-list li i {
      float: left;
      margin-top: 4px;
  }

  June 7, 2017 at 4:15 pm #327473
  jbensous

  Member

  Post count: 13

  This code helped with the lists that have fa/ss icons. However, the regular bulleted lists are still not aligning properly. I had to remove the other code because it kept putting bullets in front of the fa/ss list items. How can I get the regular bullets to align properly, without messing up the now corrected fa/ss list items?

  URL: http://www.5nine.com/5nine-cloud-security/

  The top section uses regular bulleted list.

  Also, on this page the list with fa/ss icon is cascading. no idea why because none are indented: http://www.5nine.com/5nine-v2v-easy-converter/

  June 7, 2017 at 4:33 pm #327479
  David Martin – Support

  Moderator

  Post count: 20834

  Ah yes, I see.

  Please replace the previous with this updated CSS:

  .sf-list {
    margin-left: 0 !important;
  }
  .sf-list li span {
      display: block;
      max-width: 100%;
      margin-left: 20px;
      float: left;
  }
  .sf-list li i {
      float: left;
      clear: both;
      margin-top: 4px;
  }
  .spb_text_column ul, 
  .box-content-wrap ul {
      list-style: disc outside none;
      margin-left: 15px;
  }

  June 7, 2017 at 4:48 pm #327485
  jbensous

  Member

  Post count: 13

  That helped the regular bullets, but now the icon fa/ss list is messed up again: http://www.5nine.com/5nine-cloud-security/

  sorry. 🙁

  June 7, 2017 at 6:01 pm #327510
  David Martin – Support

  Moderator

  Post count: 20834

  In the above code, find this:

  .sf-list li span {
      display: block;
      max-width: 100%;
      margin-left: 20px;
      float: left;
  }

  Delete this: float: left;

• Back to forum

  Posted in: Dante