Re: [css-d] Design question regarding columns and containers
Just so that beginners don't misunderstand, you can keep columns floating side-by-side regardless of window width if you declare a fixed width on the block that contains all the columns. That doesn't strike me as being table emulation, but was that your intention? No Paul, that is not table emulation - that's a regular fixed-width layout with width (in some form) declared on both container and its elements (columns). A table - CSS table or HTML table - expands to contain its children, and the emulations I was thinking of are the solutions we sometimes used to make old IE (7 and older) emulate CSS table. Don't think we need those IE-specific solutions anymore, but they do exist. If I grokked correctly the OP was trying to figure out whether it made sense to only declare width on the elements (column) inside a container, or to declare width on the container and let the width of the elements (columns) relate to the container-width. It ain't that simple... regards Georg __ css-discuss [css-d@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] CSS Star rating: an accessible solution
Hi. Accessibility is always one of my first concerns and here in Italy I'm fighting my own battle to get developers adopt a more accessible way of coding their sites to deal with user's needs. This morning a friend of mine (currently working on a big company web site) asked if there's a simple method to get an accessible styling of CSS star rating. I made up a test, send it, and come back with this personal solution: http://onwebdev.blogspot.com/2011/02/css-star-rating.html Personally, there's nothing difficult with this solution. Finally screen readers users won't have to deal with empty elements anymore. HTH :-) http://www.css-zibaldone.com http://www.css-zibaldone.com/test/ (English) http://www.css-zibaldone.com/articles/ (English) http://onwebdev.blogspot.com/ (English) __ css-discuss [css-d@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] weird scroll bar...
On 2/5/11 3:27 PM, Michael Beaudoin wrote:
I have a weird one for you all...
I have done a site where it is fine. The client added a new page and
had to redo the menu at the top. It's done as a table in a div (yeah,
had to do it quickly and was a bit rusty. will be correcting it when I
get a bit more time to tutz with it).
The live site is fine (sample page: http://www.tjs.org/giving.html)
If you go to the development version
(http://www.tjs.org/testarea/giving.html) you will see a horizontal
bar at the bottom of the frame, and in IE it shows a vertical bar
too. Can't understand what I messed up.
Thanks for the look-see and the help.
Michael
On 2/5/11 3:53 PM, David Laasko wrote:
Dunno. But try this, nevertheless:
#container {
/*overflow: auto;--delete*/
overflow: hidden;/*--add*/
}
Did not check [whatever version[s] you are talking about] IE .
Best,
~d
Thanks for the help. Not sure why it was fine at first and then started to
show
the scroll bars.
One more simple thing that makes me look like a knucklehead.
Thanks,
Michael
__
css-discuss [css-d@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] Positioning images within a table cell
Hi All, I'm trying to put together a map-driven interface. An embryonic example is at http://www.gjctech.co.uk/test/test.php (.) The 'work in progress' CSS stylesheet is at http://www.gjctech.co.uk/test/csw.css The map consists of a number of tiles, each in a table cell. At each vertical edge of the map is a full-height table cell. What's vexing me is trying to find a way to position the '+' and '-' controls at the top of the right-hand cell while keeping the 'scroll right' control in the centre of the same cell. I can kludge this by creating an inner table with three rows in the right-hand cell, but I'd rather do this with CSS if possible. I've tried using position:absolute, but that positions the controls absolutely on the page while I need them positioned relative to the top edge of the table cell. Since the cell itself has vertical-align:center, using position:relative on the images places them close to the centre of the cell just above the scroll arrow. What I need is to have the '+' and '-' near to the top of the cell with the scroll arrow in the centre. Is this possible using CSS, and if so how? All help gratefully received. -- Geoff __ css-discuss [css-d@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] Positioning images within a table cell
Geoff Lane wrote: I'm trying to put together a map-driven interface. An embryonic example is at http://www.gjctech.co.uk/test/test.php (.) The 'work in progress' CSS stylesheet is at http://www.gjctech.co.uk/test/csw.css The map consists of a number of tiles, each in a table cell. At each vertical edge of the map is a full-height table cell. What's vexing me is trying to find a way to position the '+' and '-' controls at the top of the right-hand cell while keeping the 'scroll right' control in the centre of the same cell. [...] I've tried using position:absolute, but that positions the controls absolutely on the page while I need them positioned relative to the top edge of the table cell. It sounds like you need to set position: relative on the td element. That way, it will establish a system of coordinates for absolutely positioned elements inside it - i.e., they will be positioned relative to the upper left corner of the cell. -- Yucca, http://www.cs.tut.fi/~jkorpela/ __ css-discuss [css-d@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] Positioning images within a table cell
It sounds like you need to set position: relative on the td element. That way, it will establish a system of coordinates for absolutely positioned elements inside it - i.e., they will be positioned relative to the upper left corner of the cell. I believe this is correct, but if I recall correctly, relative positions don't work reliably on table cells. If you find that to be the case, you'll need to add a container div inside of the table cell, set its width and height to 100%, and its position to relative. -Paul Burney http://burney.ws __ css-discuss [css-d@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] Positioning images within a table cell
At 4:51 PM -0500 2/8/11, Paul Burney wrote: It sounds like you need to set position: relative on the td element. That way, it will establish a system of coordinates for absolutely positioned elements inside it - i.e., they will be positioned relative to the upper left corner of the cell. I believe this is correct, but if I recall correctly, relative positions don't work reliably on table cells. If you find that to be the case, you'll need to add a container div inside of the table cell, set its width and height to 100%, and its position to relative. Correct. The behavior of positioned table cells is undefined, so browsers get to do whatever they want, up to and including ignoring your declaration altogether. At least some do. If you explicitly set the cell to 'display: block' then most (but possibly not all) browsers will then honor 'position: relative' but the cell will no longer act as part of the overall table, which probably defeats the original intent. So, as Paul says, throw a div in there, gritting your teeth about the crufty markup if necessary, and relatively position the div. If you want to position in relation to the right or bottom edges of the cell, you may have to get creative with heights and widths and so on. If you only care about top and/or left, you can skip all that. -- Eric A. Meyer (http://meyerweb.com/eric/), List Chaperone CSS is much too interesting and elegant to be not taken seriously. -- Martina Kosloff (http://mako4css.com/) __ css-discuss [css-d@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] IE vertical spacing problem
Disclaimer -- I have NOT finished the side navigation or the text in the header. This problem deals with the extra vertical space in the main content area. This is in html5 and parses looks right in other browsers. http://www.umcommin.org/index4finalize.php What is causing all this extra space in ie and not in other browsers. Carol __ css-discuss [css-d@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] IE vertical spacing problem
On 2/9/2011 12:32 AM, Carol Swinehart wrote: Disclaimer -- I have NOT finished the side navigation or the text in the header. This problem deals with the extra vertical space in the main content area. This is in html5 and parses looks right in other browsers. http://www.umcommin.org/index4finalize.php What is causing all this extra space in ie and not in other browsers. IE5? IE6? IE7? It looks identical to me in IE8 and Firefox 3.6. -- Al Sparber - PVII http://www.projectseven.com Dreamweaver Menus | Galleries | Widgets http://www.projectseven.com/go/hgm The Ultimate Web 2.0 Carousel __ css-discuss [css-d@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] IE vertical spacing problem
On 2/9/11 12:32 AM, Carol Swinehart wrote:
Disclaimer -- I have NOT finished the side navigation or the text in the
header. This problem deals with the extra vertical space in the main content
area.
This is in html5 and parses looks right in other browsers.
http://www.umcommin.org/index4finalize.php
What is causing all this extra space in ie and not in other browsers.
Carol
Delete these in the head of the document and space will go away.
!--
link rel=stylesheet type=text/css href=um_files/slidedec.css
media=screen /
--
!--
script type=text/javascript src=um_files/slidedec.js/script
style type=text/css
#slidedeck_frame {
width: 350px;
height: 150px;
}
/style
--
--
http://chelseacreekstudio.com/
http://chelseacreekstudio.com/fa/
__
css-discuss [css-d@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/
