Position div within a list item in the middle - html

Question

I have a div in a list item which is floated right. The div positions it self at the top right corner of the list item. Is it possible to position it in the middle-right without the use of padding or margins?
---------------
DIV
---------------
Needs to be:
---------------
DIV
---------------

Answer 1

I made a bunch of assumptions and didn't bother check this first.
li {
height: 32px;
}
li div {
width: 100%;
line-height: 32px;
text-align: center;
}

Answer 2

You could use the table cell method.
<div class="wrap one">
<div class="inner-wrap">
<div class="inner">Test</div>
</div>
</div>
With the CSS defining a parent as a table, then table-cell with vertical align:
.wrap .inner {
background: white;
float: right;
}
.wrap.one {
display: table;
width: 100%;
}
.wrap.one .inner-wrap {
display: table-cell;
vertical-align: middle;
}
Demo: http://jsfiddle.net/vFqSC/

Answer 3

If you want the div to take up the full space you could position the div this way:
li div {
float: right;
height: 100%;
}
or if you don't want it to take up the full space
li div {
position: absolute;
right: 0px;
top: 50%;
height:80%;
margin-top:-40%; // Half of height
}
If you have a hard coded list height and div height:
li { height: 50px; }
li div {
position: absolute;
right: 0px;
height:30px;
top: 10px;
}
There are many ways to do this, you should provide more information on how you want it to behave and look

Answer 4

Yes, you can, but margin or padding is the preferred method, but you could use relative positioning and assess a amount along on vertical axis. fiddle: http://jsfiddle.net/De4CV/1/
div {
width:200px;
height:200px;
background:#333;
}
div p {
font:1em normal Futura, sans-serif;
color:#f5f5f5;
text-align:right;
position:relative;
top:90px;
}
<div class="div">
<p>Hello there!</p>
</div>