Re: [css-d] slight layout change: center numbers in circles.

2011-01-15 Thread Philippe Wittenbergh

On Jan 15, 2011, at 4:10 PM, Bob Rosenberg wrote:

> I am not sure what the rules are when the first selected font does not 
> contain the character but a subsequent one does (ie: Will it search the 
> subsequent fonts for the character or just give up since it has found a prior 
> font that is usable).

The rule are fairly simple: check if the character exists in the first listed 
font, if not, skip to the next one, etc. If no fonts in the list contain the 
requested character, check for 'a' font-family available on the user system  
(and that is one reason to always specify a generic font-family).

Note that I've seen IE 6 and 7 sometimes not play by those rules on XP.

> ...
> 
> For Windows and Macintosh listing Arial Unicode MS, ITC Zapf Dingbats, and 
> Zapf Dingbats should insure that you will always find at least one available 
> font on the user's system. I am not sure what font to use for Linux but I 
> think that a Zapf Dingbats font exists there and will be installed.

Arial Unicode MS is good suggestion (not always available on win XP, iirc; and 
not installed on OS X 10.4).  Adding DejaVu Sans (or DejaVu Serif) will insure 
wide coverage, including Linux (the font is installed by default on most Linux 
distros).

Philippe
---
Philippe Wittenbergh
http://l-c-n.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] [test]: CSS and the HTML5 video element

2011-01-15 Thread Gabriele Romanato

Hi.
It took a little bit to find a good converter from FLV to OGV, but  
finally I did it!

The video is 27 mb in size, so you have to be a little bit patient :-)
Results are encouraging, especially for future CSS3 enhancements:

http://onwebdev.blogspot.com/2011/01/css-and-html5-video-element.html

note: also floating works, just as for the  element. it seems  
that supporting browsers have cloned their default display role from  
 to . cascade works correctly. borders, margin etc.  
too. dimensions either.


Tested in Chrome(latest), Safari(latest), Firefox(latest, i.e. 4 beta  
latest), Opera(latest).
Safari has some problems loading the video. I think it expects ogg  
instead of ogv or something :-)


again, hope that helps HTH :-)

Gabriele


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] [test]: CSS and the HTML5 video element

2011-01-15 Thread Philippe Wittenbergh

On Jan 15, 2011, at 7:13 PM, Gabriele Romanato wrote:

> It took a little bit to find a good converter from FLV to OGV, but finally I 
> did it!
> The video is 27 mb in size, so you have to be a little bit patient :-)
> Results are encouraging, especially for future CSS3 enhancements:
> 
> http://onwebdev.blogspot.com/2011/01/css-and-html5-video-element.html
> 
> note: also floating works, just as for the  element. it seems that 
> supporting browsers have cloned their default display role from  to 
> . cascade works correctly. borders, margin etc. too. dimensions either.
> 
> Tested in Chrome(latest), Safari(latest), Firefox(latest, i.e. 4 beta 
> latest), Opera(latest).
> Safari has some problems loading the video. I think it expects ogg instead of 
> ogv or something :-)

I've no idea on which OS you managed to have that video loading in all those 
browsers. On OS X 10.6, it partly (*) worked in Chrome 10 dev channel and 
nothing else (Safari 5 and webkit nightly, Gecko 1.9.2 and 2.0b- fx nightly)

(*) very slow to load (slower than expected for the given file size), blocky 
display, stuttering.

Philippe
---
Philippe Wittenbergh
http://l-c-n.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/


Re: [css-d] [test]: CSS and the HTML5 video element

2011-01-15 Thread Philip Taylor (Webmaster, Ret'd)



Gabriele Romanato wrote:


It took a little bit to find a good converter from FLV to OGV, but
finally I did it!
The video is 27 mb in size, so you have to be a little bit patient :-)
Results are encouraging, especially for future CSS3 enhancements:


Seamonkey 2.0.11 under Win/XP PRO;SP3

Partially rotated rounded-cornered square containing the
word "Ogg" and a |> button that has no perceivable effect.

As regards the possible delay while 27Mb delivers itself,
would it not be possible to use a streaming protocol, as in (say)

src="rtsp://example.org/streaming/video.ogv/"

rather than

src="video.ogv"

as written ?

Philip Taylor
__
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] [test]: CSS and the HTML5 video element

2011-01-15 Thread David Laakso

On 1/15/11 5:13 AM, Gabriele Romanato wrote:


It took a little bit to find a good converter from FLV to OGV, but 
finally I did it!


http://onwebdev.blogspot.com/2011/01/css-and-html5-video-element.html

Gabriele





Greetings from Oaxaca.

Please see:
1.png
2.png
3.png
4.png


Best,
Jeronimo Lopez Ramirez
Mexico



--
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/


Re: [css-d] [test]: CSS and the HTML5 video element [1]

2011-01-15 Thread David Laakso

On 1/15/11 9:19 AM, David Laakso wrote:







Screenshots Mac OS X10.4.11

--
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/


[css-d] Overriding styles

2011-01-15 Thread Tim Climis
I ran into an interesting application of CSS yesterday, that, while not useful 
for most people, might be in the "fun to know" category for others.

I write software that interfaces with a government website through an 
embedded browser, and we're working on a UI overhaul.  Unfortunately for us, 
the government site is ugly as sin, but someone had the idea of substituting 
our own stylesheet to try and give it a make-over.

So I set to doing that, but got a bit discouraged when I looked at the source 
and saw things like:



But then I noticed that in Firebug, this was translated into CSS as 

td[valign="top"] {
  vertical-align: top;
}

td[bgcolor="#445588"] {
  background-color: #458;
}

So I put the following rule in the stylesheet:
[bgcolor] {background-color: transparent}

and it worked!  All the HTML elements with bgcolor were reset!

So, apparently, it's possible, using CSS, to override element styles not set 
using CSS.  I can't really think of any common usages for this, but it might 
be handy some time if you need to redo a site and don't have control over 
the HTML source.

---Tim
__
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] [test]: CSS and HTML5 audio element

2011-01-15 Thread Gabriele Romanato

This completes the test series on HTML5 media elements:

http://onwebdev.blogspot.com/2011/01/css-and-html5-audio-element.html

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] [test]: CSS and HTML5 audio element

2011-01-15 Thread David Laakso

On 1/15/11 1:37 PM, Gabriele Romanato wrote:

This completes the test series on HTML5 media elements:

http://onwebdev.blogspot.com/2011/01/css-and-html5-audio-element.html

HTH :-)



Mac OS X 10.4.11

Pass Opera/11.0
Pass Safari/4.1.3
Pass WebKit/4.1.3 (4533.19.4, r63031)
Fail SeaMonkey/2.0.11
Fail Camino/ 2.0.6

~juan



--
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/


[css-d] (no subject)

2011-01-15 Thread amitabha ghosh
I have designed a page layout in css by using s. but i am finding while
opening in another browser computer it is breaking all the designs. can
anybody help me to sort it out?
-- 
amitabhaghosh
__
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] (no subject)

2011-01-15 Thread Kevin A. Cameron
Post link.
Could be 1 of many things: linking local files (that are on your computer
but no one else's), invalid CSS or markup, different browser/version...

Kevin


On Sat, Jan 15, 2011 at 11:33 AM, amitabha ghosh  wrote:

> I have designed a page layout in css by using s. but i am finding
> while
> opening in another browser computer it is breaking all the designs. can
> anybody help me to sort it out?
> --
> amitabhaghosh
> __
> 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-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] (no subject)

2011-01-15 Thread JWN

Morning Amitabhaghosh

You wrote

I have designed a page layout in css by using s. but i am finding 
while

opening in another browser computer it is breaking all the designs. can
anybody help me to sort it out?
--
amitabhaghosh


A clickable link to the page in question would provide us place to start to 
provide the help you seek.


It would also be helpful to know in what browsers you're trying to view the 
page and and what Operating systems. (ie win xp pro etc)


As an aside, it's also helpful to provide a "subject" in the subject line. 
(ie. "page doesn't work in some browsers")  It helps keep the archives 
straight.



Best

Jim Nannery
aka www.oldcurmudgeon.net

__
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] multi-line text vertical align

2011-01-15 Thread 李硕
Hello,

I've made a page, but I don't know how
to make the top left multi-line text become
vertical middle.
I want to change the content of the text
later, so I want it to be vertical middle by
itself.

The page:

http://www.ffb-all.com/my-test/1.html

I've tried

#site-description {
  display: table-cell;
  float: left;
  font-size: 24px;
  line-height: 36px;
  vertical-align: middle;
  width: 400px;
}

and the

#branding has height: 300px;

but it doesn't work.


Thanks!

__
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] multi-line text vertical align

2011-01-15 Thread John D

This CSS works:

#test {
border: 5px  double #eee;
display: table-cell;
background-color: #FF;
height: 300px;
width: 400px;
margin: 0 auto;
font-size: 24px;
line-height: 36px;
vertical-align: middle;
text-align: center;
}

I have ignored branding and instead used only one DIV as follows:

 在下方键入问题,你将会在最短时间内获得回答。

更多功能,请见底部导航区。


The file is attached for you to test it out.  I am not sure if you can get it 
through this newsgroup.

> Hello,
> 
> I've made a page, but I don't know how
> to make the top left multi-line text become
> vertical middle.
> I want to change the content of the text
> later, so I want it to be vertical middle by
> itself.
> 
> The page:
> 
> http://www.ffb-all.com/my-test/1.html
> 
> I've tried
> 
> #site-description {
>   display: table-cell;
>   float: left;
>   font-size: 24px;
>   line-height: 36px;
>   vertical-align: middle;
>   width: 400px;
> }
> 
> and the
> 
> #branding has height: 300px;
> 
> but it doesn't work.
> 
> 
> Thanks!
> 
>
  __
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] multi-line text vertical align

2011-01-15 Thread 李硕
Thanks!

I know the reason now, the vertical-align attribute
cannot be put together with float attribute.

2011/1/16 John D 

>  This CSS works:
>
> #test {
> border: 5px  double #eee;
> display: table-cell;
> background-color: #FF;
> height: 300px;
> width: 400px;
> margin: 0 auto;
>
> font-size: 24px;
> line-height: 36px;
> vertical-align: middle;
> text-align: center;
> }
>
> I have ignored branding and instead used only one DIV as follows:
>
>  在下方键入问题,你将会在最短时间内获得回答。
>
> 更多功能,请见底部导航区。
>
>
> The file is attached for you to test it out.  I am not sure if you can get
> it through this newsgroup.
>
>
> > Hello,
> >
> > I've made a page, but I don't know how
> > to make the top left multi-line text become
> > vertical middle.
> > I want to change the content of the text
> > later, so I want it to be vertical middle by
> > itself.
> >
> > The page:
> >
> > http://www.ffb-all.com/my-test/1.html
> >
> > I've tried
> >
> > #site-description {
> > display: table-cell;
> > float: left;
> > font-size: 24px;
> > line-height: 36px;
> > vertical-align: middle;
> > width: 400px;
> > }
> >
> > and the
> >
> > #branding has height: 300px;
> >
> > but it doesn't work.
> >
> >
> > Thanks!
> > 
> >
>
__
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] multi-line text vertical align

2011-01-15 Thread Philippe Wittenbergh

On Jan 16, 2011, at 2:44 PM, 李硕 wrote:

> Thanks!
> 
> I know the reason now, the vertical-align attribute
> cannot be put together with float attribute.

Not really the issue. If you float an element, its display will be 'block' and 
not 'table-cell'.

see also
http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo

Philippe
---
Philippe Wittenbergh
http://l-c-n.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/