Anne,
On Sep 13, 2006, at 12:03 AM, Anne E. Shroeder wrote:
I'm scratching my head over this one. I've got two different
versions, one
using a table and one using CSS to layout the bars, but in neither
case can
I achieve a consistent underline across the screen as required. See
http://www.language-works.com/swimdesign/no-tables.htm for the two
versions, plus the graphic mockup which I'm trying to imitate! I
greatly
appreciate any insights. Can this even be done?
Yes, but the html needs to change. Getting the html well structured
before working on the css often helps stabilize the design. Also,
using good html markup will help users with css turned off and users
with devices that don't support css. Not to mention that using valid,
well structured markup helps browsers render your page more
consistently.
Try something like this...
div class=tabnavbar
!-- h3 is arbitrary, use whatever header makes sense within the rest
of the document --
h3Regions:/h3
ul
lia href=spanNorth America/span/a/li !-- lose the
spans if possible --
lia href=spanAsia/span/a/li
lia href=spanEurope/span/a/li
lia href=spanAll/span/a/li
/ul
form name=form2 method=post action=
select name=select size=1
option selectedChoose a Sector/option
option value=Sector 1Sector 1/option
option value=Sector 2Sector 2/option
/select
/form
/div
div class=tabnavbar
h3Products:/h3
ul
lia href=spanRisk Diagnostic/span/a/li
lia href=spanIRAPS/span/a/li
lia href=spanPortfolio Monitoring/span/a/li
lia href=spanBespoke/span/a/li
lia href=spanEducational/span/a/li
/ul
/div
Given that markup (which is usable unstyled too) the bottom blue line
you are having trouble with is as easy as
.tabnavbar {
border-bottom: 1px solid;
}
If you choose to use this markup and have difficulty applying your
other styles to it, let me know and I'll see if I can help.
--
Roger Roelofs
Remember, if you’re headed in the wrong direction,
God allows U-turns!
~Allison Gappa Bottke
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
