0

I have a Visualforce Component that has a un-ordered list. I want that list to have no style other then the indentation. Usually with HTML you would just specify the ul css to be list-style:none or list-style-type:none. It is not working for me for some reason. Can someone see what is going wrong here? Is it because I am using an in-line conditional style statement?

** I should also note that the component is being referenced in a visualforce email template. I think this might be the cause of the issue.**

I have tried:

  • giving the ul a class and specifying in the style tag
  • giving the ul an id and specifying in the style tag
  • directly calling the ul in the style tag
  • adding to the li inline style editing
  • adding inline style directly to the ul tag
<style type="text/css">
p { font-size: 15px; font-family: "Arial", Times, serif; color: #141516;}
#title {text-decoration: underline;}
.center {text-align: center;}
.displayinline{display: inline-block;}
.floatRight {float: right;}
.floatLeft {float: left;}
.requiredGuarantor {padding-bottom: -1;}
.ulist {list-style:none !important;}
</style>

<p><strong>Funding Conditions:</strong>
    <ul class="ulist">
       <li style="display: {!IF(cr.Credit_Stip1__c == null , 'none', 'block')}">{!cr.Credit_Stip1__c}</li>
       ...
 </p>

1 Answer 1

0

To remove the bullet, just use the "ul" and its class name as shown below.

ul.ulist {list-style-type: none;}

Here is an example

    <apex:page controller="listStyleCon">
<style>
ul.thelist {list-style-type: none;}
</style>
<apex:repeat value="{!accounts}" var="account">
<ul class="thelist">
        <li>{!account.Name} </li>
        </ul>
  </apex:repeat>
</apex:page>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.