Re: [css-d] Formating Table Columns

[James Denholm-Price]

Hi Anas & [EMAIL PROTECTED] :-)

On 14/08/06, Anas R. <[EMAIL PROTECTED]> wrote:
> I'm trying to give a table colum some special attributs using CSS,

Good use of  but I'm afraid that Firefox (and Opera) are
following the spec. [1] and IE is not, e.g. see [2] which links to a
nice explanation at [3] -- only border, background, width & visibility
can be applied to  and  columns [1].

The css-d wiki [2] suggests some alternatives that you could use, e.g.
combining CSS2 selectors and IE-specific rules.

For forwards compatibility with IE7 [4] you're usually recommended to
use conditional comments to hide the IE-only stylesheet /but/ I've no
idea if IE7 will preserve the ability to apply more than the 4
properties to columns -- anyone?

HTH,
  James

[1] http://www.w3.org/TR/CSS21/tables.html#q4
[2] http://css-discuss.incutio.com/?page=StylingColumns
[3] http://ln.hixie.ch/?start=1070385285&count=1
[4] http://css-discuss.incutio.com/?page=IE7
__
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/

Re: [css-d] CSS page breaks when printing even small tables

[James Denholm-Price]

On 02/02/06, James Golden <[EMAIL PROTECTED]> wrote:
> Hello there, first post here so I hope all goes well.

Hi James -- welcome to the list :-) or happy de-lurk ;-)

> I am building an online home price quote application styled with CSS.
[..]
> There are any number of options selected. This lends to problems when it
> is time to print the price quote since I do not know ahead of time how
> many options with descriptions (the tabled pieces) there will be.  The
> result is that option tables may print off on one page with the rest of
> the table on the next; being cut in its middle.
[...]

I've no real handle on the CSS spec's but the CSS-D wiki has a few
useful-looking pages:


http://css-discuss.incutio.com/?page=PrintingTables

The latter mentions tr {page-break-inside: avoid;} being honoured by
Opera but not Gecko/IE :-(


http://css-discuss.incutio.com/?page=PrintStylesheets

HTH,
 James
__
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/

Re: [css-d] Fieldset or Legend how to?

[James Denholm-Price]

Hi Reynier & [EMAIL PROTECTED]:

On 11/15/05, Reynier Perez Mira <[EMAIL PROTECTED]> wrote:
> ...
> How I can check if this CSS is well formed and perform CSS Standars from W3C?

Just thought it was worth advertising the W3C's CSS validator:
http://jigsaw.w3.org/css-validator/

There you can check a URL, upload a file (CSS or HTML with embedded

Re: [css-d] Footnotes

[James Denholm-Price]

On 7/11/05, [EMAIL PROTECTED] <[EMAIL PROTECTED]> wrote:
> At 10:30 AM 7/8/2005, Stephen R Laniel wrote:
> >I'd like to create CSS2 footnotes ...
> 
> See http://web.tampabay.rr.com/bmerkey/examples/print-endnotes.html. The JS
> used only works for IE.

I've quickly hacked a version that is less IE-specific but uses CSS
with @media print to reveal the endnotes for printing:
http://king-maths.kingston.ac.uk/~James/JS/printing_endnotes.htm

Using display:none; deliberately hides the generated endnotes from
screenreaders as they could have the  attributes read
out to them anyway.

James
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Print CSS Expandable Menu buggy

[James Denholm-Price]

Hi Melissa & [EMAIL PROTECTED],

On 7/11/05, Craddock, Melissa <[EMAIL PROTECTED]> wrote:
> I am using a expanding menu based on
> http://www.gazingus.org/html/menuExpandable.html
>... I would like to have the menu print expanded even though it is collapsed
> on the screen.
> When I first go to the page, I can click on print preview and see the
> expanded menu even though it is collapsed on the screen. If I click on
> one of the items on the screen to expand and click on it again to
> collapse, that item will print collapsed. In my screen stylesheet I have
> the class set to display: none;. In the print stylesheet the display
> none is removed, yet it still doesn't print. 

I guess it's because the menu JS
 (?) sets the element's
"style.display.block" properties to "none" to hide them then you click
... this is hard to override in a print stylesheet as inline style
(which is what the DOM "style" property effectively manipulates) has a
high specificity


You could try increasing the specificty of the print display rules by
adding "!IMPORTANT" or more specific selectors.

Ideally (IMO) we could rewrite the menu script to apply "show" and
"hide" classes to the elements and then all you need do is override
show and hide in the print style sheet but I appreciate this is
harder.

James

PS: Google reveals a nice Brainjar article
: that says

"Inline Styles

Style properties defined inline, i.e., within an HTML tag's STYLE
attribute, are given the same weight that an ID selector would have.
In terms of order, they are treated as though they occur after all
other rules.

In other words, inline styles take precedence over anything but a
conflicting declaration in a user style sheet."
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Float killing links?

[James Denholm-Price]

Hi Wade & [EMAIL PROTECTED]:

On 7/5/05, H. Wade Minter <[EMAIL PROTECTED]> wrote:
> I'm running into an oddity.  I'm using divs to create pseudo-tables...
> My page is at http://beta.comedyworx.com/showshow.php?show_id=17
> The HTML and CSS validate, but the links aren't clickable.
> ... I've narrowed down the symptom
> to the float: left line - when that line is removed, the links are
> clickable (though the layout is screwed up).
> ... The relevant CSS section is: ...
> div.pseudorow {
>margin:10px;
>overflow:visible;
>position:relative;
>width:100%;
> }

Removing position:relative; seems to cure it in Firefox and I'm not
sure that rule is needed  (links are not a problem in IE, layout is a
bit broken though).

James

PS: Incidentally (OT for css-d), using  is a
no-no as users with JS disabled get nothing from the links ... better
to use  where
getBio returns false to prevent the link action occurring when JS is
active. Better still would be to ditch the hard-wired actions
altogether and use unobtrusive JS principles to dynamically attach the
event handlers ;-)
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Submit Button Styling

[James Denholm-Price]

On 7/4/05, Olly Hodgson <[EMAIL PROTECTED]> wrote:
> On 7/4/05, Hershel Robinson <[EMAIL PROTECTED]> wrote:
> 
> > Anyone know why they render differently? And more importantly, how to
> > get IE to match Firefox?
> 
> I've not yet figured out why, or a solution to it for that matter ...
> Sorry I can't be of more help.

Me either but you can of course assign a width, e.g. width:20ex; for
your example.

James
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] A4 Print page

[James Denholm-Price]

On 6/29/05, Richard Brown <[EMAIL PROTECTED]> wrote:
> I need to create an output from a sql database through php to an html
> doc. The output needs to print out on A4. How can is I find out the css
> needed to arrange this to happen?

This page from the css-d wiki may help:
http://css-discuss.incutio.com/?page=PrintStylesheets

James

PS: If you mean automaticlly printed when the user browses to the page
then you probably need JavaScript in addition to a print stylesheet,
something using window.print() for example.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Overlapping divs

[James Denholm-Price]

Hi Brett & css-d,

On 6/28/05, Brett Lucas <[EMAIL PROTECTED]> wrote:
> In a link list I have on my site I have a problem in
> Mozilla browsers..The title line(style=searchtitleevent) is wrapping on lower
> screen recolutions...and overlapping the next div
> (searchvenue) causing an unplanned and annoying effect.
>  ...
> 
>  href="topics/newlect1.php">Training Event for New
> Lecturers
> 
> Venue: Birmingham Conference
> Park - December 2004
>  class="searchurl">Theme:  href="newlect.php">New Lecturers
>   
> 
> the styles are as follows:
> 
> .searchtitleevent { ...
> height: 20px;
>... }

Mozilla (Firefox for me) is obeying strictly your height declaration
and then overflows any overflowing text (which seems to float above
the other content) whereas IE treats it like a minimum height -- if
your layout demands that it IS a min-height then you could hack your
way around IE like this:

.searchtitleevent {
 min-height: 20px; /* the value for CSS browsers */
}

* html .searchtitleevent {
 height: 20px; /* the value for IE Win */
}

(There is an additional clause for being nice to IE/Mac that I forget
at the moment... more info on the css-d wiki:
http://css-discuss.incutio.com/?page=CssHack)

James

PS: Hi Brett! I'm in HE in the UK & look at the HEA site occasionally ;-)
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Absolutely positioned menu displays in FF but not IE

[James Denholm-Price]

Hi David & css-d,

On 6/29/05, David Wang <[EMAIL PROTECTED]> wrote:
> The site I'm working on has an absolutely positioned menu at the top of each
> page. However, within the markup, the menu is actually at the end of the
> page. The menu (#smenu) shows correctly in Firefox but not in IE.

Bizarrely if you change #smenu to relative rather than absolute
positioning like this:

div#smenu {
position: relative;
...

then IE seems better but Ff does what you'd expect and displays the
#smenu relative to its initial position :-(

James
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/