Re: [css-d] Test on OS X 10.7 Lion please
Philippe Wittenbergh wrote: url: http://dev.l-c-n.com/_temp/helveN-L.html Do the first two paragraphs display as serif fonts on Lion (OS X 10.7) with any Gecko/ Firefox browser? If yes, there is a bug in Gecko. (I assume default font preferences - 'western' should use 'serif' as a default). The test fails (displays a serif font) on my side; I already cleared all font-caches. Other browsers work correctly. Seamonkey 2.5 (/still/ no auto-update to 2.6.1; has this been completely forogtten ?), Win/XP : Serif, serif, serif, sans-serif, sans-serif. 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 on OS X 10.7 Lion please
Philippe Wittenbergh wrote: On Jan 4, 2012, at 6:40 PM, Philip TAYLOR wrote: Seamonkey 2.5 (/still/ no auto-update to 2.6.1; has this been completely forogtten ?), Win/XP : Serif, serif, serif, sans-serif, sans-serif. Possible depending on what you have installed; that is not what I asked though… The Q was specifically about OS X 10.7 Now I am intrigued : if (as per your original message), Do the first two paragraphs display as serif fonts on Lion (OS X 10.7) with any Gecko/ Firefox browser? If yes, there is a bug in Gecko. and the first two paragraphs (in fact, the first three) display as serif fonts in XP with a Gecko browser, why is this not also an indication of a bug in Gecko ? Why does it have to manifest itself only in OS X 10.7 in order to demonstrate the existence of a bug ? I thought that HTML CSS were platform-neutral, and therefore if one sees unexpected behaviour on /any/ platform using the same underlying rendering engine this could be indicative of a rendering engine bug. 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 on OS X 10.7 Lion please
On Jan 4, 2012, at 6:53 PM, Philip TAYLOR wrote:
Possible depending on what you have installed; that is not what I asked
though…
The Q was specifically about OS X 10.7
Now I am intrigued : if (as per your original message),
Do the first two paragraphs display as serif fonts on Lion (OS X 10.7) with
any Gecko/ Firefox browser? If yes, there is a bug in Gecko.
and the first two paragraphs (in fact, the first three)
display as serif fonts in XP with a Gecko browser, why
is this not also an indication of a bug in Gecko ? Why
does it have to manifest itself only in OS X 10.7 in order
to demonstrate the existence of a bug ? I thought that
HTML CSS were platform-neutral, and therefore if one
sees unexpected behaviour on /any/ platform using the same
underlying rendering engine this could be indicative of
a rendering engine bug.
Because the fonts used are specific to OS X (10.6+) and thus not installed on
Win XP ?
The question was – does this testcase work on OS X 10.7. The answer is
currently NO on any release version of Gecko based browser. That is an OS
specific bug - I wanted to make sure that what I saw on my machine(s) was not
due to some odd combination of settings on my side.
Safari 5.1 appears to have another bug specific to @font-face { src:()} with
the same font. I'm not clear yet where exactly the bug is (the bug is fixed in
nightly webkit builds).
Satisfied ?
I thought the subject line was clear enough about the scope of the question…
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] How To Clear CSS Caching?
On the subject of getting the latest copy of the CSS file each time, you can add a unique value to the URI of the CSS file. Instead of: link href=MyStyles.css rel=stylesheet type=text/css / Use (on first load): link href=MyStyles.css?t=12345 rel=stylesheet type=text/css / And second load: link href=MyStyles.css?t=12346 rel=stylesheet type=text/css / Obviously, this is simplified when using some server-side language to generate the value. --G __ 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] How To Clear CSS Caching?
What I suggest you is using PHP. link rel=stylesheet href=/css/main.css??php echo time();? type=text/css / On Tue, Jan 3, 2012 at 19:29, Elli Vizcaino elli...@yahoo.com wrote: Hello Everyone, I'm noticing that not every browser refreshes the CSS even when using shift + refresh. Based on this article: http://css-tricks.com/update-on-css-caching/ there is a way to make sure the browser gets the most updated stylesheet when requesting from the server. However, the article isn't' clear on how to implement this, as in, it doesn't provide an actual code sample. Plus some seem to require programming. Anyone know how I can get apply this so I can my CSS is also updated in the browser when I make changes? Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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/ -- Boray Eris www.pidizayn.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] How To Clear CSS Caching?
On Jan 4, 2012, at 10:42 AM, Boray ERIS wrote: What I suggest you is using PHP. link rel=stylesheet href=/css/main.css??php echo time();? type=text/css / This would work provided the php interpreter parses the page. To insure parsing, change the suffix of the web page from '.html' to '.php'. To confirm parsing, place p?php echo time();?/p anywhere within the body of the page. Cheers, tedd _ t...@sperling.com http://sperling.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] How To Clear CSS Caching?
1/ Confirm that the CSS and markup are valid, that it is not hanging on a CSS error, and that you have saved the CSS file before uploading it. It's not always possible to use valid css due to proprietary css markup such as -webkit, -moz, as I'm using CSS3 the HTML markup however is valid. 2/ Delete the CSS file from the server. Boot. Upload the CSS file from the hardrive to the server. I have tried this numerous time and even so the browser will still use the CSS stylesheet it has cached. Elli Vizcaino Oh, my. Now what we'll do? Perhaps a movie... Best, Robert -- A River Ran Through it David Laasko sometimes your replies are pure malarkey! Just don't get your sense of humorwhy do you do it? Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] How To Clear CSS Caching?
What I suggest you is using PHP. link rel=stylesheet href=/css/main.css??php echo time();? type=text/css / Boray Eris www.pidizayn.com Yea I saw that in the article: http://css-tricks.com/can-we-prevent-css-caching/ but there was debate within the comments on which format was better to implement. Some involved a more involved query for better accuracy - which only added to my feeling of overwhelm. And then, what happens when your not using PHP but only HTML markup? Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] How To Clear CSS Caching?
Instead of: link href=MyStyles.css rel=stylesheet type=text/css / Use (on first load): link href=MyStyles.css?t=12345 rel=stylesheet type=text/css / And second load: link href=MyStyles.css?t=12346 rel=stylesheet type=text/css / Obviously, this is simplified when using some server-side language to generate the value. --G I've also done: style.css?v=1 then increment the number as needed... Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com Thanks Tom, Glenn will give these a shot. Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] @Fontface Not Working?
Hi Everyone, Am working on a coming soon page for my site and @font-face doesn't seem to be working. Not sure why .I implemented @font-face on another project and it was fine. Now it's not working for this. I am using a different font now - could this have something to do with it? Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] @Fontface Not Working?
Yes, of course it could. A huge number of things could have gone wrong — without an example it is almost impossible to provide helpful advice. However: • Often, it's just a misplaced file issue: the fonts are in the wrong directory relative to the stylesheet with the declaration, or said stylesheet isn't being called itself. • I often end up spelling the font file names differently in the @font-face declaration that they appear on the file system; other times I will have used a slightly different string in the font-family stack call then how I defined it in the @font-face declaration — remember capitalisation matters, and a string with spaces in it needs to be between quotes. • Some servers don't handle the font MIME-type properly, which can cause some browsers not to read them properly. • Rarely, my font files end up garbled for some reason or other, usually after being produced in the various given formats by an automatic generator. Try examining the font files with your operating system (via your file system explorer) to see if they look right. • For a while, some versions of Webkit would screw up conjunction of text-shadow with certain custom fonts and end up simply not rendering the glyphs. As far as I'm aware though, this is resolved in every major distribution. Seriously though, show us the site! ;) Regards, Barney Carroll barney.carr...@gmail.com +44 7429 177278 barneycarroll.com Hi Barney! Ok so I tested on latest versions of Chrome, Opera, Safari for Windows, IE9, IE8, IE7 and they are all rendering the font. It's in FF where I'm having the problem. I tested in both FF3.6 9 and what you see on those versions of FF, is the fallback font (Brush Script STD) of the font stack. The other browsers render Creampuff as it should. Please find link below: http://www.e7flux.com/e7flux2012/ TIA, Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] @Fontface Not Working?
Hi Barney! Ok so I tested on latest versions of Chrome, Opera, Safari for Windows, IE9, IE8, IE7 and they are all rendering the font. It's in FF where I'm having the problem. I tested in both FF3.6 9 and what you see on those versions of FF, is the fallback font (Brush Script STD) of the font stack. The other browsers render Creampuff as it should. Please find link below: http://www.e7flux.com/e7flux2012/ Creampuff is not loading in any browser that I have. Brush Script STD is not installed so I get fallback to 'Cursive' which is rendered as MS Comic Sans. WinXP: Opera 11.60, Chrome 17, Iron 16, FF 9.0.1, IE 7 8 Duncan __ 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] @Fontface Not Working?
On Wed, Jan 4, 2012 at 1:16 PM, Elli Vizcaino elli...@yahoo.com wrote: Ok so I tested on latest versions of Chrome, Opera, Safari for Windows, IE9, IE8, IE7 and they are all rendering the font. It's in FF where I'm having the problem. I tested in both FF3.6 9 and what you see on those versions of FF, is the fallback font (Brush Script STD) of the font stack. The other browsers render Creampuff as it should. Please find link below: http://www.e7flux.com/e7flux2012/ are you sure you're referencing the proper location for your font? I get Comic Sans in all browsers and when I look at the developer console in Chrome I see this error: Failed to load resource: the server responded with a status of 404 (Not Found) http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf -- Jason Arnold http://www.jasonarnold.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/
Re: [css-d] @Fontface Not Working?
Ok so I tested on latest versions of Chrome, Opera, Safari for Windows,
IE9, IE8, IE7 and they are all rendering the font. It's in FF where I'm
having the problem. I tested in both FF3.6 9 and what you see on those
versions of FF, is the fallback font (Brush Script STD) of the font stack.
The
other browsers render Creampuff as it should. Please find link
below:
http://www.e7flux.com/e7flux2012/
are you sure you're referencing the proper location for your font? I
get Comic Sans in all browsers and when I look at the developer
console in Chrome I see this error:
Failed to load resource: the server responded with a status of 404
(Not Found) http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf
The font is in its own directory. The link you provided places the the fonts
directory within the CSS directory. I don't know why it's a problem this time
around because the way I wrote my CSS code is exactly how I used it in another
project (http://www.e7flux.com/clients/sof/) and it works fine.
@font-face {
font-family: Creampuff;
src: url('fonts/creampuff.ttf') format('truetype');
font-weight: normal;
}
Elli
__
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] @Fontface Not Working?
Elli Vizcaino wrote:
The font is in its own directory. The link you provided places the the fonts
directory within the CSS directory. I don't know why it's a problem this time
around because the way I wrote my CSS code is exactly how I used it in another
project (http://www.e7flux.com/clients/sof/) and it works fine.
@font-face {
font-family: Creampuff;
src: url('fonts/creampuff.ttf') format('truetype');
font-weight: normal;
}
'fonts/creampuff.ttf' is a relative URL, Elli : to what
base is it relative ?
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] @Fontface Not Working?
The font is in its own directory. The link you provided places the the fonts
directory within the CSS directory. I don't know why it's a problem this time
around because the way I wrote my CSS code is exactly how I used it in
another project (http://www.e7flux.com/clients/sof/) and it works fine.
@font-face {
font-family: Creampuff;
src: url('fonts/creampuff.ttf') format('truetype');
font-weight: normal;
It could be that Creampuff should be creampuff.
CSS is generally case sensitive and your file name is lowercase.
('fonts/creampuff.ttf').
Just a thought. I prefer to use Google fonts because the syntax is pretty much
easier and works all the time.
__
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] @Fontface Not Working?
Elli,
As Philip Taylor has correctly pointed out, the URI you used in your
style sheet is a relative URI.
The CSS specification (http://www.w3.org/TR/CSS2/syndata.html#uri) has
this to say about relative URIs:
For CSS style sheets, the base URI is that of the style sheet, not that
of the source document.
Therefore:
1. The style sheet in question is located at:
http://www.e7flux.com/e7flux2012/css/e7flux.css
2. The URL for the font is relative to that location.
3. url('fonts/creampuff.ttf') translates to the absolute URI:
http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf
Solution:
Change
url('fonts/creampuff.ttf')to
url('../fonts/creampuff.ttf') or
url('http://www.e7flux.com/e7flux2012/fonts/creampuff.ttf')
and things should work. (Tested with Safari Devtools - works.)
For future projects you might also consider using a web font service
such as Fontsquirrel to avoid other web font-related issues.
Same thing goes for /sof/.
Hope this helps,
Jørgen
Am 04.01.12 21:30, schrieb Elli Vizcaino:
Ok so I tested on latest versions of Chrome, Opera, Safari for Windows,
IE9, IE8, IE7 and they are all rendering the font. It's in FF where I'm
having the problem. I tested in both FF3.6 9 and what you see on those
versions of FF, is the fallback font (Brush Script STD) of the font stack. The
other browsers render Creampuff as it should. Please find link
below:
http://www.e7flux.com/e7flux2012/
are you sure you're referencing the proper location for your font? I
get Comic Sans in all browsers and when I look at the developer
console in Chrome I see this error:
Failed to load resource: the server responded with a status of 404
(Not Found) http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf
The font is in its own directory. The link you provided places the the fonts
directory within the CSS directory. I don't know why it's a problem this time
around because the way I wrote my CSS code is exactly how I used it in another
project (http://www.e7flux.com/clients/sof/) and it works fine.
@font-face {
font-family: Creampuff;
src: url('fonts/creampuff.ttf') format('truetype');
font-weight: normal;
}
Elli
__
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] @Fontface Not Working?
On 01/05/2012, at 8:52 AM, Joergen W. Lang wrote: For future projects you might also consider using a web font service such as Fontsquirrel to avoid other web font-related issues. What are the other web font-related issues you refer to here? KathyW. __ 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] @Fontface Not Working?
Elli,
As Philip Taylor has correctly pointed out, the URI you used in your
style sheet is a relative URI.
The CSS specification (http://www.w3.org/TR/CSS2/syndata.html#uri) has
this to say about relative URIs:
For CSS style sheets, the base URI is that of the style sheet, not that
of the source document.
Therefore:
1. The style sheet in question is located at:
http://www.e7flux.com/e7flux2012/css/e7flux.css
2. The URL for the font is relative to that location.
3. url('fonts/creampuff.ttf') translates to the absolute URI:
http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf
Solution:
Change
url('fonts/creampuff.ttf') to
url('../fonts/creampuff.ttf') or
url('http://www.e7flux.com/e7flux2012/fonts/creampuff.ttf')
and things should work. (Tested with Safari Devtools - works.)
For future projects you might also consider using a web font service
such as Fontsquirrel to avoid other web font-related issues.
Same thing goes for /sof/.
Hope this helps,
Jørgen
Wow this is really weird. Could it be the version of Chrome you are
viewing? Because the other project had no problems rendering the custom
font and in fact, there was another discussion related to the Little
Days font being used in that project with numerous folks being able to
view the font from a number of browsers with the relative path written
out as I demoed earlier.
And even now with making the base to the root directory:
../fonts/creampuff.ttf it
still doesn't show up in FF3.6 or FF9 but does show in all the other
browsers I tested previously. So it seems the path of the base url is
irrelevant.
I am familiar w them and have some of their fonts but I don't think that
fontsquirrel is guaranteed 100% to make your fonts render. Tried their service
earlier and their markup didn't work either.
Elli Vizcaino
Helping artists, entrepreneurs and small
businesses knock the socks off the competition!
http://www.e7flux.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] @Fontface Not Working?
The font is in its own directory. The link you provided places the the
fonts directory within the CSS directory. I don't know why it's a
problem this time around because the way I wrote my CSS code is exactly how I
used it in another project (http://www.e7flux.com/clients/sof/) and it works
fine.
@font-face {
font-family: Creampuff;
src: url('fonts/creampuff.ttf') format('truetype');
font-weight: normal;
It could be that Creampuff should be creampuff.
CSS is generally case sensitive and your file name is lowercase.
('fonts/creampuff.ttf').
Just a thought. I prefer to use Google fonts because the syntax is pretty
much
easier and works all the time.
Just tried your suggestion and changed the name to creampuff and FF still isn't
budging but once again all the other browser render it fine. At this point, I'm
considering purchasing a web font as opposed to using a commercially free one.
What a drag...the amount of issues w browsers supporting @font-face
Elli Vizcaino
Helping artists, entrepreneurs and small
businesses knock the socks off the competition!
http://www.e7flux.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] @Fontface Not Working?
Am 04.01.12 23:26, schrieb Kathy Wheeler: On 01/05/2012, at 8:52 AM, Joergen W. Lang wrote: For future projects you might also consider using a web font service such as Fontsquirrel to avoid other web font-related issues. What are the other web font-related issues you refer to here? Cross-browser compatibility, file sizes (of different formats), licensing (to some extent). __ 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] Nesting problem in html code
Hello, I am kindly asking for help hoping that a dozen pairs of eyes might see more than I do. A friend of mine has a Wordpress blog: http://run-united.com He told me that after he changed something, there was a problem in the start page: The right column containing certain widgets was suddenly pushed down below the main column with the recent article's teaser texts. Almost as if if suddenly had a clear: defined. One problem when analyzing is that browsers sometimes do some yutocorretion of html text, closing elements who's closing tags are missing etc. But here is what I found out: On the startpage the structure within the #main div is (viewed in Firefox/Firebug) div id=container div id=content /div div id=primary /div /div div id=footer /div However, if I look at the source code, I see a comment naxt to a closing /div saying that this ends the #container, and AFTER that the div#primary begins. If I click on an article (e.g. http://run-united.com/?p=3452), the error doesn't occur on that page. And in Firebug I see that the div#pimary comes AFTER the div#container. Thus I guess the problem is that on the startpage somehow a tag is not properly closed or something like that, and Firefox and other browsers do some autocorrection that results in the div#primary being within the div#container. And that results in the css rules being executed in a wrong way and in the div#primary being pushed down. Has anybody had a similar problem and maybe knows the cause for this? My friend deleted the last article/post he added, but the error stayed. I looked at the the contents of both the last articles and the widgets within the admin panel of the Worpress blog, but I couldn't find any tags that weren't closed properly. I apologize if this is the wrong mailing list for such a problem. Just let me know and I won't bother any more. Otherwise any help would be appreciated. -- Best regards Christian __ 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] @Fontface Not Working?
Are you sure it's working in your other project (http://www.e7flux.com/clients/sof/)? Because when i go to that site I get the same error message in chrome for littledays.ttf and that font definitely does not show up. Your issue is you're using the relative src from where the css is located if you wanted. Using fonts/creampuff.ttf tells the browser to look at site.domain.com/location-of-css/fonts/creampuff.ttf. If you used /fonts/creampuff.ttf then the browser will look for the file in site.domain.com/fonts/creampuff.ttf. This is also the issue with your other project for the littledays.ttf file. So you have two choices, you can either 1) correct your src property in your @font-face or 2) move the font files to a fonts folder inside the folder where your css file is located. Can you tell me what version of Chrome and OS you're viewing from? And have you checked it out in any other browsers? Because it was never an issue before. The link had been up for discussion in another post a couple of weeks ago and plenty of people on the list saw it and responded. No one has ever reported not seeing Little Days at all. So this is really surprising as this is the first time I'm hearing this. Creampuff on the other hand is the font in question for this topic and the one that doesn't show up for me in FF but does on all the other browsers. My chrome version is 16. If you cold post a screen shot w browser and OS details that would be awesome! Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] Nesting problem in html code
2012-01-05 0:54, Christian Kirchhoff wrote: A friend of mine has a Wordpress blog: http://run-united.com He told me that after he changed something, there was a problem in the start page: The right column containing certain widgets was suddenly pushed down below the main column with the recent article's teaser texts. Almost as if if suddenly had a clear: defined. I'd suggest that you first validate the HTML markup using http://validator.w3.org and then the CSS code using http://jigsaw.w3.org/css-validator/. Many of the errors reported are not important (may be intentional uses of nonstandard features), but an unclosed div in markup and a parse error in CSS code may well have serious effects. Yucca __ 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] @Fontface Not Working?
On Wednesday 2012-01-04 11:16 -0800, Elli Vizcaino wrote: Ok so I tested on latest versions of Chrome, Opera, Safari for Windows, IE9, IE8, IE7 and they are all rendering the font. It's in FF where I'm having the problem. I tested in both FF3.6 9 and what you see on those versions of FF, is the fallback font (Brush Script STD) of the font stack. The other browsers render Creampuff as it should. Please find link below: On Firefox, in the Web Console (open it with Tools - Web Developer - Web Console prior to loading the page), I see the error message: downloadable font: rejected by sanitizer (font-family: creampuff style:normal weight:normal stretch:normal src index:0) source: http://www.e7flux.com/e7flux2012/fonts/creampuff.ttf @ http://www.e7flux.com/e7flux2012/css/e7flux.css?v=2 This means that the font has errors in it. For security reasons (since the system's font handling code is not necessarily robust against malicious fonts), we don't pass such fonts off to the OS, even though in many cases they're just mistakes. -David -- 턞 L. David Baron http://dbaron.org/ 턂 턢 Mozilla http://www.mozilla.org/ 턂 __ 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] @Fontface Not Working?
On Firefox, in the Web Console (open it with Tools - Web Developer - Web Console prior to loading the page), I see the error message: downloadable font: rejected by sanitizer (font-family: creampuff style:normal weight:normal stretch:normal src index:0) source: http://www.e7flux.com/e7flux2012/fonts/creampuff.ttf @ http://www.e7flux.com/e7flux2012/css/e7flux.css?v=2 This means that the font has errors in it. For security reasons (since the system's font handling code is not necessarily robust against malicious fonts), we don't pass such fonts off to the OS, even though in many cases they're just mistakes. -David Thanks David, I was starting to suspect it was the font itself. I opened it in a font program and it was a modified version of the original so somewhere along those lines something went wrong. Going to switch to a different font. Thanks for the confirmation! Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] Nesting problem in html code
From what I can see in FF/Firebug the problem that's causing the side bar to
push down is this:
#content {
margin: 0 280px 0 20px;
}
That's a huge margin on the right side of the content div. Plus there are no
width specified for either of the divs: #content #primary. If you're not
going to specify a width you should at least float the content div left along w
the primary div float right as you have.
Elli Vizcaino
Helping artists, entrepreneurs and small
businesses knock the socks off the competition!
http://www.e7flux.com
- Original Message -
From: Christian Kirchhoff christian.kirchh...@editura.de
To: css-d@lists.css-discuss.org css-d@lists.css-discuss.org
Cc:
Sent: Wednesday, January 4, 2012 5:54 PM
Subject: [css-d] Nesting problem in html code
Hello,
I am kindly asking for help hoping that a dozen pairs of eyes might see more
than I do.
A friend of mine has a Wordpress blog: http://run-united.com
He told me that after he changed something, there was a problem in the start
page: The right column containing certain widgets was suddenly pushed down
below
the main column with the recent article's teaser texts. Almost as if if
suddenly had a clear: defined.
One problem when analyzing is that browsers sometimes do some yutocorretion
of
html text, closing elements who's closing tags are missing etc.
But here is what I found out: On the startpage the structure within the #main
div is (viewed in Firefox/Firebug)
div id=container
div id=content
/div
div id=primary
/div
/div
div id=footer
/div
However, if I look at the source code, I see a comment naxt to a closing
/div saying that this ends the #container, and AFTER that the
div#primary begins.
If I click on an article (e.g. http://run-united.com/?p=3452), the error
doesn't occur on that page. And in Firebug I see that the div#pimary comes
AFTER the div#container.
Thus I guess the problem is that on the startpage somehow a tag is not
properly
closed or something like that, and Firefox and other browsers do some
autocorrection that results in the div#primary being within the
div#container.
And that results in the css rules being executed in a wrong way and in the
div#primary being pushed down.
Has anybody had a similar problem and maybe knows the cause for this?
My friend deleted the last article/post he added, but the error stayed. I
looked
at the the contents of both the last articles and the widgets within the
admin
panel of the Worpress blog, but I couldn't find any tags that weren't
closed properly.
I apologize if this is the wrong mailing list for such a problem. Just let me
know and I won't bother any more. Otherwise any help would be appreciated.
-- Best regards
Christian
__
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/
[css-d] Need help with floats
I'm developing a page (only needs to be viewable by MSIE at this time) where there is a div containing 2 images and 2 text blurbs. The upper image is at the top and floats left with the text flowing around it on the right, which mostly works. The lower image is supposed to be opposite; positioned at the bottom and floated right, with the text to the left flowing around the image, but the text does not flow. Would someone have the time to look at this and advise? The page can be viewed here: http://manicreader.com/test.html __ 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] @Fontface Not Working?
Am 05.01.12 01:05, schrieb Kathy Wheeler: On 01/05/2012, at 9:53 AM, Joergen W. Lang wrote: Am 04.01.12 23:26, schrieb Kathy Wheeler: On 01/05/2012, at 8:52 AM, Joergen W. Lang wrote: For future projects you might also consider using a web font service such as Fontsquirrel to avoid other web font-related issues. What are the other web font-related issues you refer to here? Cross-browser compatibility, file sizes (of different formats), licensing (to some extent). I can see how licensing might be an issue, but what difference would hosting the font yourself vs services like Fontsquirrel make to cross browser or file size issues? As far as I know, Fontsquirrel does not even offer font hosting. Instead they help you build a @font-face kit [1]. This contains the CSS and font files needed to host them on a machine of your choice. Hosting might be a help since services like the Google Fonts API [2] abstract away the construction of the @font-face rule altogether. You just need to place the appropriate link tag in the head of your HTML file. Both ways share the quality that the CSS rules are optimized to serve the best possible font for the browser requesting it. Jørgen P.S.: We might be drifting off-topic here. Maybe better continue off-list? [1] http://www.fontsquirrel.com/fontface/generator [2] http://www.google.com/webfonts#ChoosePlace:select __ 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] @Fontface Not Working?
On Wed, Jan 4, 2012 at 4:55 PM, Elli Vizcaino elli...@yahoo.com wrote: Can you tell me what version of Chrome and OS you're viewing from? And have you checked it out in any other browsers? Because it was never an issue before. The link had been up for discussion in another post a couple of weeks ago and plenty of people on the list saw it and responded. No one has ever reported not seeing Little Days at all. So this is really surprising as this is the first time I'm hearing this. Creampuff on the other hand is the font in question for this topic and the one that doesn't show up for me in FF but does on all the other browsers. My chrome version is 16. If you cold post a screen shot w browser and OS details that would be awesome! This is the case in all browsers I checked with on Windows XP (IE7, Chrome 16, FireFox, Safari) and Mac OS X 10.7 (Chrome 16, Firefox, Safari). I mentioned littledays.ttf because you said it worked and that you used that same code for creampuff.ttf, but the reason creampuff.ttf doesn't work is because you never had working code to begin with since you're littledays.ttf does not work either. Currently, the font that renders on your http://www.e7flux.com/clients/sof/ project for me is Monotype Corsiva since that is a font I have installed on my machines, but Little Days does not render and no browser is able to get the font file because the browser is looking in the wrong place based on your src property. When you use a path like fonts/creampuff.ttf that is relative to where your css file is located at and so the browser is going to look in http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf;. I would send a screenshot of what I'm seeing but I'm between moves and my servers are currently down. I would suggest using absolute urls for these things or use the next best thing /e7flux2012/fonts/creampuff.ttf since that will point the browser at the root of your site and build the path out to the proper spot. Once you get the src property set correctly things should be working much better. As to why people may see the fonts just fine, one thing to keep in mind is that if you have the font installed on your computer then you will see the font show up just fine because your computer has the font and the browser is able to grab it from your machine. This is also why others may have had no problem viewing your page with the specified font. If you want to test @font-face make sure you test it from a machine that doesn't already have the font installed. -- Jason Arnold http://www.jasonarnold.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/
Re: [css-d] Need help with floats
The easiest way is to have something like this:
#cindyContainer img {
float: left;
margin: 0 10px 4px 0;
}
#jenniferBio img {
float: right;
margin: 0 0 4px 10px;
}
Look at this sample page:
http://www.mytechnet.talktalk.net/trainers01.htm
Good luck.
Date: Wed, 4 Jan 2012 16:13:33 -0800
From: bbre...@stellarmicro.com
To: css-d@lists.css-discuss.org
Subject: [css-d] Need help with floats
I'm developing a page (only needs to be viewable by MSIE at this time)
where there is a div containing 2 images and 2 text blurbs.
The upper image is at the top and floats left with the text flowing
around it on the right, which mostly works.
The lower image is supposed to be opposite; positioned at the bottom and
floated right, with the text to the left flowing around the image, but
the text does not flow.
Would someone have the time to look at this and advise? The page can be
viewed here:
http://manicreader.com/test.html
__
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] @Fontface Not Working?
On Wed, Jan 4, 2012 at 4:55 PM, Elli Vizcaino elli...@yahoo.com wrote: Can you tell me what version of Chrome and OS you're viewing from? And have you checked it out in any other browsers? Because it was never an issue before. The link had been up for discussion in another post a couple of weeks ago and plenty of people on the list saw it and responded. No one has ever reported not seeing Little Days at all. So this is really surprising as this is the first time I'm hearing this. Creampuff on the other hand is the font in question for this topic and the one that doesn't show up for me in FF but does on all the other browsers. My chrome version is 16. If you cold post a screen shot w browser and OS details that would be awesome! This is the case in all browsers I checked with on Windows XP (IE7, Chrome 16, FireFox, Safari) and Mac OS X 10.7 (Chrome 16, Firefox, Safari). I mentioned littledays.ttf because you said it worked and that you used that same code for creampuff.ttf, but the reason creampuff.ttf doesn't work is because you never had working code to begin with since you're littledays.ttf does not work either. Currently, the font that renders on your http://www.e7flux.com/clients/sof/ project for me is Monotype Corsiva since that is a font I have installed on my machines, but Little Days does not render and no browser is able to get the font file because the browser is looking in the wrong place based on your src property. When you use a path like fonts/creampuff.ttf that is relative to where your css file is located at and so the browser is going to look in http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf. I would send a screenshot of what I'm seeing but I'm between moves and my servers are currently down. I would suggest using absolute urls for these things or use the next best thing /e7flux2012/fonts/creampuff.ttf since that will point the browser at the root of your site and build the path out to the proper spot. Once you get the src property set correctly things should be working much better. As to why people may see the fonts just fine, one thing to keep in mind is that if you have the font installed on your computer then you will see the font show up just fine because your computer has the font and the browser is able to grab it from your machine. This is also why others may have had no problem viewing your page with the specified font. If you want to test @font-face make sure you test it from a machine that doesn't already have the font installed. Jason, The reason I have a hard time wrapping my head around you stating that no browser can render the Little Days font is because that isn't true. I can see the Little Days font on my machine on all browsers as plenty of other people have as well when I originally posted. Here is the link again for anyone following and who would like to chime in on wether the Little Days font is rendering: http://www.e7flux.com/clients/sof/ Even a friend with a Mac can see it and I highly doubt she's got Little Days installed - I honestly don't think many people would unless they are a designer. if what you're saying is true I would have heard from the client by now about the issue. So perhaps something is going on in your machine. Perhaps you have default settings on your machine or browsers - I don't know. But I can not accept that Little Days is not rendering in any browser when I can see the font for myself on my machine. I can also see creampuff with the exception of FF. All that being said, I'm not negating that it's probably best to use absolute paths but in the case of the creampuff font not rendering in FF it didn't make a difference even when the path was changed to absolute. In fact, if you inspect the code you should see that it's an absolute path now and has been for the last several hours. Elli Vizcaino Helping artists, entrepreneurs and small businesses knock the socks off the competition! http://www.e7flux.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] @Fontface Not Working?
When you use a path like fonts/creampuff.ttf that is relative to where your css file is located at and so the browser is going to look in http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf. I also think you're convinced it's an absolute path issue but it's not. You get an error message because I'm a WP and it's PHP driven and directories just work a little differently - people just cant get direct access to a directory on WP, just because it exist - it just doesn't work that way. And as already stated several times FF doesn't render the font even w the absolute path. Someone else already responded that there was an issue w the font itself a corruption of some sort which is what I was suspecting and I was able to check it out in a font programmer which confirmed it was an altered version of the original. At this point, I am moving on to another font. And I will set up my @font-face the same way and send you a link directly to see what happens. Elli __ 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] @Fontface Not Working?
Am working on a coming soon page for my site and @font-face doesn't seem to be working. Not sure why .I implemented @font-face on another project and it was fine. Now it's not working for this. I am using a different font now - could this have something to do with it? I believe you need quotes around multi-word font family names -- both for the @font-face declaration and for the standard rule. Beth __ 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] @Fontface Not Working?
Elli Vizcaino wrote:
On Wed, Jan 4, 2012 at 4:55 PM, Elli Vizcaino elli...@yahoo.com wrote:
Can you tell me what version of Chrome and OS you're viewing from? And
have you checked it out in any other browsers? Because it was never an issue
before. The link had been up for discussion in another post a couple of weeks
ago and plenty of people on the list saw it and responded. No one has ever
reported not seeing Little Days at all. So this is really surprising as this is
the first time I'm hearing this.
Creampuff on the other hand is the font in question for this topic and the
one
that doesn't show up for me in FF but does on all the other browsers.
My chrome version is 16. If you cold post a screen shot w browser and OS details
that would be awesome!
This is the case in all browsers I checked with on Windows XP (IE7,
Chrome 16, FireFox, Safari) and Mac OS X 10.7 (Chrome 16, Firefox,
Safari). I mentioned littledays.ttf because you said it worked and
that you used that same code for creampuff.ttf, but the reason
creampuff.ttf doesn't work is because you never had working code to
begin with since you're littledays.ttf does not work either.
Currently, the font that renders on your
http://www.e7flux.com/clients/sof/ project for me is Monotype Corsiva
since that is a font I have installed on my machines, but Little Days
does not render and no browser is able to get the font file because
the browser is looking in the wrong place based on your src
property. When you use a path like fonts/creampuff.ttf that is
relative to where your css file is located at and so the browser is
going to look in
http://www.e7flux.com/e7flux2012/css/fonts/creampuff.ttf;. I would
send a screenshot of what I'm seeing but I'm between moves and my
servers are currently down. I would suggest using absolute urls for
these things or use the next best thing
/e7flux2012/fonts/creampuff.ttf since that will point the browser at
the root of your site and build the path out to the proper spot. Once
you get the src property set correctly things should be working much
better.
As to why people may see the fonts just fine, one thing to keep in
mind is that if you have the font installed on your computer then you
will see the font show up just fine because your computer has the font
and the browser is able to grab it from your machine. This is also
why others may have had no problem viewing your page with the
specified font. If you want to test @font-face make sure you test it
from a machine that doesn't already have the font installed.
Jason,
The reason I have a hard time wrapping my head around you stating that no
browser can render the Little Days font is because that isn't true. I
can see the Little Days font on my machine on all browsers as plenty of
other people have as well when I originally posted. Here is the link
again for anyone following and who would like to chime in on wether the
Little Days font is rendering: http://www.e7flux.com/clients/sof/
I don't have Little Days installed here. Using FF9.0.1 on that site,
error console says:
Error: downloadable font: download not allowed (font-family: Little
Days style:normal weight:normal stretch:normal src index:0): content
blocked
source: http://www.e7flux.com/clients/sof/css/fonts/littledays.ttf
Source File: http://www.e7flux.com/clients/sof/css/styles.css
Line: 0
Source Code:
@font-face { font-family: Little Days; font-weight: normal; src:
url(fonts/littledays.ttf); }
Don't have Chrome around here to check. Fonts (and much other) problems
when viewed in Konqueror 3.5.9, but that's an old version of Konqueror.
--
David
gn...@hawaii.rr.com
authenticity, honesty, community
__
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/
