Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.
- Friends
-
- CommentAuthorljromanoff
- CommentTimeApr 5th 2006
I have a tabbed panel thing for a project I'm working on. It's written in JSF with CSS styling it. That's all well and good, except that there a slight inconsistency between IE and Firefox that I can't seem to account for. In Firefox it works properly, but in IE 6 and IE 7 there's a slight gap between the tabs and the main content.
Check it out here:
http://ljonn.com/misc/zero/tabbed_test.html
Any ideas? -
2 things you'll need to do to fix the problem:
1) Make the tabs anchors instead of form buttons. The tabs aren't submitting a form, so there's no need to make them submit buttons.
2) Remove the table row after the tabs (the one with 5 TD's that each contain the " " character).
I'm not sure what purpose the row in #2 serves, but hopefully it's not important to the functionality of the page (I didn't look at the code in detail, just enough to determine what would remove the gap). -
- CommentAuthorljromanoff
- CommentTimeApr 5th 2006
John,
Thanks for the help, but I can't edit any of that. I can only edit the CSS. -
Hmm... well you can at least make the gap smaller by adding something like this:
table#content__idJsp8 tr td input {
border-bottom: 1px solid #D6E0D2;
}
table#content__idJsp8 tr td.myFaces_panelTabbedPane_inactiveHeaderCell input {
border-bottom: 1px solid #F1F5F0;
}
However, to get rid of the last 1px, you'll need to get rid of that table row somehow. Can you add JavaScript to the page? -
- CommentAuthorljromanoff
- CommentTimeApr 6th 2006
I'll give that a try, although I fear that might have negative effects in Firefox.
And, no, can't add JavaScript. This is part of a massive web application and the Java folks won't allow any JS or any other edits aside from the CSS from me.
1 to 5 of 5