Question

I’ve been working on something, and am stuck on some CSS problem. I have this:

http://sharepress.atwebpages.com/temp/

As you can see, there are two items being listed with crosses next to them. On the second item listed, you can see it is a multiline paragraph. I wanted to know how to vertically center align the ‘x’ vertically for multiline paragraphs like this.

Thank you all for your help and time 🙂

Answer 1

Sounds pretty much like the same problem as this. Depends on your browser support, but display: table-cell is a pretty good way for newer browsers. More details on the answers here.

Vertical Align a DIV with dynamic height inside another DIV

if the X is constant height(eg 20px here), you could just give the container div position:relative and the x position:absolute; top: 50%; margin-top: -10px;

So in your example something like

.taskItemLi {
  position:relative;
}
.delbtn {
  position: absolute;
  top: 50%;
  margin-top: -10px;
  right: 0;
}