Multiple text aligns in a single <div> </div> on the same line?

[Shadow]

I have no clue on how to get this to work, I have a sub-navigation menu I'm putting on a site that I'm building and I need the link text centered in the cell but there is a > after that text I need aligned to the right of the cell (same cell) to get the appearance that I want/need.HTML

<div id="wrapper2"><div id="pathlv1"><a class="class1" href="index.html">Home</a> <span class="class2">></span><!-- end #pathlv1 --></div><div id="pathlv2">Page #1<span class="class2">></span><!-- end #pathlv2 --></div><!-- end #wrapper2 --></div>

CSS

.indexcsslayout #wrapper2 {	position:absolute;	top:110px;	left:5px;	height:15px;	width:950px;	background-color:#903;}.indexcsslayout #pathlv1 {	position:absolute;	top:0px;	left:0px;	height:15px;	width:100px;	vertical-align:middle;	font-weight:bold;	font-size:13px;	background-color:#000;	color:#FF0;}.indexcsslayout #pathlv2 {	position:absolute;	top:0px;	left:100px;	height:15px;	width:100px;	vertical-align:middle;	font-weight:bold;	font-size:13px;	background-color:#000;	color:#FFF;}.class1 {	color:#FFF;	text-decoration:none;	text-align: center;}.class2 {	text-align:right;}

[ShadowMage]

A span will only ever be as wide as it needs to be. Meaning text-align won't work on a span. At least in its default display mode. A span by default is inline. What you want is a block or inline-block. A block will break to a new line so you probably want to go with inline-block. You can change its display using the display property:display: inline-block;That will make it so that it still stays on the same line, but you can set a width for it and use text-align.

[chibineku]

You could centre the text and put the > in a span with display: inline-block and float it to the right. It'll need position:relative, too, I think. Basically the same idea as jkloth but with a float.

[ShadowMage]

You could centre the text and put the > in a span with display: inline-block and float it to the right. It'll need position:relative, too, I think. Basically the same idea as jkloth but with a float.

Right, I forgot about the other text being centered. My previous suggestion won't quite work in that case. As chibineku said, give the pathlv2 div text-align: center and put the '>' in a span and float the span right. You won't need to define the display of the span though. I don't think you'll have to put the relative positioning on it either.FWIW, you should consider removing all that absolute positioning stuff. That only leads to trouble. Use margins, padding, display, float, and clear instead.

[Shadow]

Thanks for the help, I managed to get it working.And you said about using margins, padding and such instead of the absolute positioning and that it just leads to problems.. I just found that out as I loaded this page and a friend showed me a screen shot of how my test site looks in 7.0.6001.18000...