Gap in a list

[KeredDrahcir]

I'm using a list to make a maenu.

<ul>
  <li>Menu 1</li>
  <li>Menu 2</li>
  <li>Menu 3</li>
  <li>Menu 4</li>
  <li>Menu 5</li>
  <li>Menu 6</li>
</ul>

I'd like to put a picture in the middle of the list and have the list items leave a gap for it but there's not always going to be siz items in the list.
Is there a way so this using CSS?

[Rabbit]

Why not break it into two lists?

[KeredDrahcir]

I can't do it like that. Not if the menu is going to have a different number of items from time to time.

[Rabbit]

I still don't understand why you can't do it like that. You can use two lists even if the number of items differ.

[KeredDrahcir]

If I could have used two lists I would have done it like that and not needed to ask for help. The point is it all needs to be the same list.

[acoder]

How about making the picture/image an item in the list and styling it differently depending on how you've styled the rest of the list?

[Rabbit]

That in no way explains why it can't be done in two lists. You will have to excuse my persistence in getting an answer to that question.

I don't see why you can't use two lists. You have provided no reasoning for why you can't use two lists. All you say is that it can't be done. I'm sorry, but that an unsatisfactory answer.

If you explain why it is impossible to use two lists, we may find a way around it. But as of now, I see no reason it would be impossible. And as such, using two lists would be the simplest solution and require no CSS.

If, at such a time, you provide a compelling reason for the impossibility of using two lists, we can explore your CSS options.