Support » Fixing WordPress » bullet points change font and layout of text

  • When I insert a bullet point, the font (and maybe the spacing and type) of the text around it – even before it – changes. I am not used to using code but I can see that the code has changed and that if I go into html view I can change it so that it is correct. This may have begun happening since I began using 3.0, I’m not sure, but it is a recent problem.

Viewing 8 replies - 1 through 8 (of 8 total)
  • Post the code or the website so we can see it and check.
    It’s likely that a css ul/li is making the spacing/font-family change.

    Thanks, tjiinh200.

    Yes, it is ul/li issue. And a span and font size one. Here is a copy of some of the code.

    <span style=”font-size: 13.3333px;”>There are reliable sources that you can reference and there are unreliable sources which you should not. (I have written about this topic <span style=”color: #0000ff;”>here</span>.) But that doesn’t mean you can’t use these unreliable websites in your study.</span>

    Referencing is only one way to use a source. There are others. I’d like to give you a few ideas on how to use Wikipedia and Google without actually referencing them.

    • The first way you can use Wikipedia is to get an overview of your topic.

    What is the desired final look of your bullet-points? Formatted and spaced exactly as the other text, or …

    Also, from what I can see, in your code, there aren’t any span where you listed them above. You are using ul/li.

    Yes, the same formatting, just bulleted and indented. Here is a post that turned out as I wanted.

    <span style=”color: #0000ff;”><span style=”color: #000000;”>In articles, you can find key words in </span></span>

    • <span style=”color: #0000ff;”><span style=”color: #000000;”>titles and sub-titles</span></span>
    • <span style=”color: #0000ff;”><span style=”color: #000000;”>abstracts</span></span>
    • <span style=”color: #0000ff;”><span style=”color: #000000;”>introductions</span></span>
    • <span style=”color: #0000ff;”><span style=”color: #000000;”>conclusions</span></span>

    <span style=”color: #0000ff;”><span style=”color: #000000;”>In books, you can find key words in </span></span>

      I don’t understand why you double-span each line?

      The reason in your css that the formatting is different for your ul/li can be found in your style.css file, particularly the lines that begin: “contentleft”. Changing this will change all bullet-pointed items that use that id, but will give you your desired effect.

      #contentleft ul{
      	margin: 0px 0px 0px 20px;
      	padding: 0px 0px 10px 0px;
      #contentleft ul li{
      	background:transparent url("images/ul-bullet.gif") 0px 3px no-repeat; /* 0px = horizontal position for left, 6px = vertical position from top */
      	margin: 0px 0px 0px 0px;
      	padding: 0px 0px 0px 18px;

      It looks fine to me as it is now, but I assume you don’t want to use the image, and instead a regular bullet-point? If that is the case, just edit the above code.


      I have only ever used the Visual editor. I don’t know how to code. This problem came out of the blue really. One day it was working well, and the next the code changed when I used the bullet button. (As I say, perhaps after I began using 3.0) I only hit the HTML view for the first time a couple of days ago, just to look under the bonnet (do you say hood?) so to speak. I don’t know why double span happens. I don’t know what a style.css file is. Sorry.

      Let me look at your suggestion and try to understand it. At least I’m learning stuff by trying to deal with this. Appreciate your help!

      I’m not sure that the changes made in 3.0 could alter the css of your ul/li – in fact I highly doubt it. However, if it only just recently showed up (“out of the blue”), it seems suspect (3.0), doesn’t it?

      Unfortunately, if you aren’t comfortable with the coding side, there is not much you can do…except go to the code and make the changes since I don’t know what editor you use.

      For your reference:
      “style.css” – This is the file that, in your specific case, handles the majority of how things look on your website. It handles the grand majority of spacing, colouring, font, meta-data, and more.

      My best guess would be that a change was made to an option in your visual editor that changed the ul/li code. Double check your settings. Also, if you have access to your website by FTP (you should), a very simple work around would be: delete the file named “ul-bullet.gif” from the “images” directory. This will force all browsers to default back to a regular bullet-point, but won’t affect the spacing issue.

      Hope this was helpful 🙂

      I just published a short post about this issue.

    Viewing 8 replies - 1 through 8 (of 8 total)
    • The topic ‘bullet points change font and layout of text’ is closed to new replies.