Home/ Questions/Q 7985081
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T11:28:13+00:00

I’m making a site where I have three <li> all floated to the left

  • 0

I’m making a site where I have three <li> all floated to the left and they each have a background of a certain image. I have text in each of the <li> and I want to move that text so that it is displayed under the background instead of on it. What would the css for this sort of layout be?

Below I have an example of what I would like the layout to be. Thanks for the help.

======   ======   ======
|          |    |          |    |         |
|          |    |          |    |         |
======   ======   ======
  text          text           text

I have no ASCII art skills but hopefully you get the idea.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Set the text in a span with a margin-top equal to the height of the background image. The span will need to be display: block for this to work. Or, better yet, just set padding-top equal to the height of the background image, with background-image-repeat: no-repeat.

    See http://jsfiddle.net/77NdE/ for a working example.

    • 0