bullet list and number list are hidden under photo

  • Affected App
    WoltLab Suite Forum

    So bullets and placed photos do not seem to work well with one another. As demonstrated here.

    • Bullet 1
    • Bullet 2
    • Bullet 3
    • Number 1
    • Number 2
    • Number 2

    The bullet or number list get hidden under the photo. There needs to be a bit more spacing between the two.

  • This doesn't work because it causes the following line to be displayed at the end of the list. There is no real fix for this due to the behavior of the bullets being outside the element in combination with a floating element.

  • This doesn't work because it causes the following line to be displayed at the end of the list. There is no real fix for this due to the behavior of the bullets being outside the element in combination with a floating element.

    This method

    I already created a topic several years ago and nobody knew a solution. Now I tried the following:

    CSS
    .nativeList {
    	display: inline-block;
    }

    It works here on the fly but I don't know if it works properly in the whole framework.


    Seems to work.


  • Take a look at the screenshot, I've used the Developer Tools to set display: inline-block; for the second list in your first post. As you can see the following line is now right after the list instead of a new line.

    It gets even worse when I set the first list to be an inline-block too.

  • Besides, typographically speaking it is completely wrong to have ANYTHING before a bullet point. They are navigation points in your information structure and should not be diluted by anything. Thus, one should actually try to avoid having anything more distinctive as the bullet points during a list.

  • Besides, typographically speaking it is completely wrong to have ANYTHING before a bullet point. They are navigation points in your information structure and should not be diluted by anything. Thus, one should actually try to avoid having anything more distinctive as the bullet points during a list.

    I disagree and more professional media (The New York Times for example) would seem to disagree as well.

    Although, I guess the compromise would be to have the photo to the right side of the bullet.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!