Graeme,
Hi, still pulling your hair out?
my suggestion is a bit different perhaps, but it seems to work in msie
and firefox; the border and font-sizes of the style sheet are for
effect, but the main layout and positioning exists in the inline
styles; i set a width on the middle text-holding div and used
line-height to keep the text in the middle; this worked on msie but not
in firefox; also, by using image align properties you can align the
left and right images with the text that way. adjust the margins and
padding percentages of the #parent div box if the image sizes blow the
structure out.:
<head><title>graeme solution</title>
<style type="text/css">
#parent div {font-family:arial; font-weight:bold; font-size:12pt;
color:brown; border:1px navy dotted;}
#parent {border:1px red dashed; }
</style>
</head>
<body>
<div id="parent" style="text-align:center;margin:5%; padding:5%"
align="center">
<div style="display:inline; text-align:right; padding:0px; width:32%;">
---->(holds left arrow image)</div>
<div style="display:inline; width:32%; margin:0px; padding:0px;
background-color:white;
text-align:center; height:45px; line-height:2em">your title text
here</div>
<div style="display:inline; text-align:left; padding:0px; width:32%;">
<----(holds right arrow image)</div>
</div>
</body>
