[css-d] Full-height table - td height in Safari/Chrome
I created a layout using a table where the table is never shorter than the height of the window/frame. Example is at http://test.dragonzreef.com/full-height-table.htm. The problem is in Safari or Chrome where the top cell does not obey a height property. I've tested it on these Windows browsers: Firefox 3.5, 3.0, 2.0 IE 6, 7 Safari 3.2 Chrome 4.1 Opera 9.6, 9.5, 9.2 K-Meleon 1.5 Any idea how to make it work in Safari and Chrome too? Andy __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] understading ul li as menus - A 5 question quest.
Philippe --- Sorry for this late reply. I couldn't wish better. All clear. :) (for now) :D Thanks for your time and css teachings on this. Márcio __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Styling forms with CSS
On Mon, Mar 22, 2010 at 3:22 PM, David Hucklesby huckle...@gmail.com wrote: BTW - I notice that tabbing through the form, I cannot reach the radio buttons... On the Mac you have to specifically enable it to tab to radio buttons. If I recall, it's under system preferences (sorry, don't have a Mac handy at the moment). __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Full-height table - td height in Safari/Chrome
Andy Harrison wrote:
http://test.dragonzreef.com/full-height-table.htm.
Any idea how to make it work in Safari and Chrome too?
Andy
Umm. I think it may require a sense of humor. Try?
html, body {
position: relative;
height: 100%
}
html, body, table, thead, tbody, tfoot, tr, th, td, h1 {
margin:0;
padding:0;
vertical-align:top;
}
#layout-table {
position: absolute;
top: 0;
width:770px;
border-collapse:separate;
border-spacing:0;
margin:0 auto;
}
--
desktop
http://chelseacreekstudio.com/
mobile
http://chelseacreekstudio.mobi/
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Full-height table - td height in Safari/Chrome
Hi! The solution is you used tbody three times. Change your first tbody/tbody to thead/thead and it will work. I just checked in chrome and ff under linux. Another thing, change your third tbody/tbody to tfoot/tfoot Kata Andy Harrison wrote: I created a layout using a table where the table is never shorter than the height of the window/frame. Example is at http://test.dragonzreef.com/full-height-table.htm. The problem is in Safari or Chrome where the top cell does not obey a height property. I've tested it on these Windows browsers: Firefox 3.5, 3.0, 2.0 IE 6, 7 Safari 3.2 Chrome 4.1 Opera 9.6, 9.5, 9.2 K-Meleon 1.5 Any idea how to make it work in Safari and Chrome too? Andy __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Die focus, die!
CSS-d,
I usually use this code to reset focus at the top of my CSS code:
:focus {
outline: 0;
}
But for some reason, on a new page I'm working on which uses Javascript
to manage some buttons, all the buttons are getting dashed line borders
when they take focus (in FireFox 3.6).
Someone suggested to me that I try this:
:focus {
outline: none;
}
But that hasn't helped.
Is there something particular about Javascript that requires special
focus handling?
Here is an example of the HTML code for the button:
input type=button
id=minus15
onclick=minus15ButtonClicked('minus15')
style=background-image:
url('images/button_minus_15_green.png');width:53px;height:53px;border:0;
value= /
Two notes: I am well aware of the accessibility issues, but I have a
reason I need to remove the focus. Also, some of the CSS is specified
inline because of how the content management system works. Ordinarily I
do all my CSS in one external document.
Anyway, any advice on what I need to look for to ensure complete removal
of any focus borders would be much appreciated.
--
Dave M G
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Die focus, die!
On Mar 25, 2010, at 11:46 AM, Dave M G wrote:
I usually use this code to reset focus at the top of my CSS code:
:focus {
outline: 0;
}
But for some reason, on a new page I'm working on which uses Javascript
to manage some buttons, all the buttons are getting dashed line borders
when they take focus (in FireFox 3.6).
Someone suggested to me that I try this:
:focus {
outline: none;
}
The dotted outline actually uses the border.
input[type=button]:focus::-moz-focus-inner {
outline: none;
border: transparent;
}
But I consider this an extremely _bad_ idea.
PS - in the future, please start a new thread instead of changing the topic of
an existing thread. Thank you.
Philippe
---
Philippe Wittenbergh
http://l-c-n.com/
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Die focus, die!
Philippe,
Thank you for responding.
input[type=button]:focus::-moz-focus-inner {
outline: none;
border: transparent;
}
This is very close to working. It does remove the undesired borders.
But, when I actually click a button, while it has focus, it shifts
downward by one pixel, pushing the rest of the styling around.
I tried setting the border to none, and to 0, and they all work for
making the border invisible, but I keep getting this shifting behaviour
on focus.
Any idea why this shifting behaviour is happening? it seems like there
is still a one pixel border being created on focus, even though it is
invisible.
PS - in the future, please start a new thread instead of changing the topic
of an existing thread. Thank you.
That's strange. I was certain I began a new thread. I didn't reply to
any other.
In any case, sorry about that. I wouldn't ordinarily do that.
--
Dave M G
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
