Dotted Line

[rbutler]

Paul helped me with this before but one minor issue. This page: http://midwestwebdesign.net/co2/

The dotted line of the left border of the #rightside div won't go down as far past my name in Opera and firefox as it does in IE, view in IE to get an idea of what I'm referring to.

Relevent css:

#rightside{
	position:absolute;
	top:250px;
	left:540px;
	width:210px;
	padding:5px 0 0 27px;
	border-left:2px dotted #000000;
	margin-left:10px/*give a little separation between main content and right side content (not space in-between) more of alignment to the right hand side*/
	margin-top:0px;
}
#rightside span#rub {
 position:absolute;
 border-left:2px solid #fff;
 height:25px;
 left:-2px;
 margin-bottom:1px;
 width:0;
}
* html #rightside span#rub {width:2px;w\idth:0}

Revelent HTML

<p class="designed">Designed By </p>
    <p><a href="javascript:;">Ryan Butler</a> &amp; <a href="javascript:;">Karyn O'Dell</a></p>
    <span id="rub"></span>

Also, could the tagline "serving the ozarks together" be shown using z-indexes in moz?

Help as always is appreciated.

[rbutler]

Interesting... two hours w/out a response...one more bump until I let it die and do research on an option.

[Paul O'B]

Hi Ryan,

Not sure exactly what you want but if you take out that span that rubs the line out and add this class below, then it seems to be about the same length in both browsers.

#rightside p.last {padding-bottom:10px;margin-bottom:0}

<p class="last"><a href="javascript:;">Ryan Butler</a> &amp; <a href="javascript:;">Karyn 
	 O'Dell</a></p>
</div>

Not sure either about what you are asking with respect to the z-indexes?

Paul

[rbutler]

If you look in IE you will see "serving the ozarks together" as a tagline near the top right underneath the graphics. In moz, this tag line gives the impression of being underneath the navigation. I was thinking with z-indexes this could be solved with moz, because IE and Opera don't exhibit this behavior.

The space was pretty much what I was looking for thanks.

[Paul O'B]

HI Ryan,

Z-indexs will only affect the stacking of elements but will not make any difference to their actual position on screen.

The problem in the tagline is simply that mozilla adds 1em of padding.margin to the top of the p element which means it moves down the page by 1em. Just set the padding and margins to zero as follows.

#tagline p {margin-top:0;padding-top:0}

Paul