今天又长知识了。 首先，最简单的，更正了长久以来的想当然，php 下 explode(‘,’, ”) != array()，而是得到长度为 1 的数组，key 是数值 0，value 是空字符串。天哪，我有多少个程序是基于 explode(‘,’, ”) == array() 写下去的，这下影响大了，得好好查一查。 其次，发现一个不晓得是 sshfs 的 bug 还是 gedit 的 bug。复制错误的过程是：用 Nautilus 或 Dolphin 打开 sshfs 挂载的目录，右击创建一个新文件。文件创建是成功的，属性是 774，用 gedit 打开它却无法保存，提示是没有写权限；但用 kwrite 编辑保存一切正常；用 gedit 再编辑 kwrite 编辑过的文件又能保存。或者，在右击创建一个新文件后，执行一次 chmod 774 filename，也能用 gedit 编辑保存了。 再次，发现在 IE6 下，用 javascript 增大元素的尺寸（比如 jQuery widget 化，增加 border，增加 padding，等），会增大父元素的尺寸。哪怕父元素已用… Continue reading Learned something basic
Tag: css
Limit table column width in IE6
I have a 2×2 table coded like this: In the td cell r2c1, if the content does wrap, it takes more width than r1c1, say r1c1 requires 100px width, and r2c1 requires 300px. But I want r2c1 content words wrap and its width limits to 100px. I put width style in the first row, i.e.:… Continue reading Limit table column width in IE6
CSS styling without images
I am quite surprised with the styling effect achieved by pure CSS without the help of images. I can round corner and rotate html elements without creating any background images. See the result I get. And this is the ONLY product image in this CSS styling demo: Although the effect is comprehensive, but with the… Continue reading CSS styling without images
Stupid IE6
我负责的一个网站的访问者中， IE6 用户仍占 6.2%，这个比例不尴不尬。改版初期对他们照顾不够，今天下狠心花了时间去测试 IE6 下的兼容性。几小时之后，IE6 下都能完全正常显示了，我也多了一些心得。 如果要加层，先设置该层 text-align:left，否则 IE6 下与层有点关系的元素，不管它是在层内还是层外，位置会摆置得莫名其妙。特别是当看到层外元素整体摆错位置，我更莫名其妙，实在搞不懂 IE6 对层的理解是什么。如果一开始就对层进行初始化（{ text-align:left; position:relative; }）就会节省很多时间。 避免使用高级的 css 语法，比如多 class 的连贯，.class-a.class-b { color:red; }。本希望该样式只应用于同时具有 class-a 和 class-b 元素，结果 IE6 不理解。如果 IE6 对不理解的 selector 作忽略处理倒还好，可是 IE6 把该样式应用到了所有 class-b 元素（只具有 class-a、不具有 class-b 的元素未受影响），IE6 是不是显得不懂装懂？祸害很大，害我多花了一小时在找被错误影响了的 class-b 元素的原因。如果实在想要多 class 的连贯的 selector，那比较可行的办法是用 jquery 来保证跨浏览器的兼容性，即 $jquery(‘.class-a.class-b’) 。 题外话：很久前我写过一篇Cross-browser CSS。今天多了两点心得，本想直接写入以前的文章。转念一想不对，今天的心得是今天的，以前的心得是以前的，以后万一我来翻看自己的文章，我也想从中看出我的成长历程，混在一起就看不出历程了。但从心得角度讲，最好把所有 cross-browser css… Continue reading Stupid IE6
Use zoom:1 as a generic IE css fix
我用“拉门”的方法做了个两端圆弧背景，宽度不固定的按钮，简言之就是用两个嵌套的 span，应用了以下 css 但是在 IE6 下，按钮左边界是圆弧，右边界仍是直角。如果我在 span 上增加 width:100%，左右倒都是圆弧，但由于 IE6 对 width 的定义不同于其他浏览器，按钮的宽度被改变了。 在没有 width 可用的情况下，怎么办？用 延伸阅读的话，在 IE6 下某些元素没有 layout，用 {zoom:1; } 可以让这些没有 layout 的元素表现得象有 layout （我这么表述可能不准确），从而改善低版本 IE 对 css 标准的理解。{zoom:1; } 是 IE fix 的一个捷径，目前没有发现对其他浏览器带来副作用。
No way to control inline elements’ height
今天在 css 里遇上一个以前不曾注意的细节： 假设<a>和<img>的 border, margin 和 padding均为0，一个被<a> wrapped 的 <img> (<a><img/></a>) 比单独一个 <img/> 在 Firefox 中 render 要高 3px，在 chrome 和 ie 下也会高一些（但我未测量数值）。 实例代码 我想了很久才知道这都是因为<a>和<img>是inline elements。Inline elements 有一些特性 they flow with text. they have line-height. the element height and width is dependent on the content and will not collapse to the borders of the… Continue reading No way to control inline elements’ height
Style Magento checkout form fields without touching the core code
Although I can change css complete restyle the checkout forms, this is not what I want to discuss today. What I want to achieve are: fix City required asterisk not showing bug change Address lines from full width to half width as City The City required asterisk is hidden by a javascript wrongly. I found… Continue reading Style Magento checkout form fields without touching the core code
Make best use of Godaddy Free Products
我不算一个好顾客——很挑剔，但可以算是 Google, Godaddy 和 Tesco 的忠实顾客，因为他们的产品或服务几乎无可挑剔——又扯远了。 我要讲的是如何把 Godaddy 购买域名后的免费赠品用足用好。Godaddy Free Products 有 Free Hosting, Free Blogcast 和 Free Photo Album。虽然我另租 1&1 的服务器，但 Godaddy 这么客气，我想不要浪费了人家的热忱。再说，在 Godaddy Free Products 上搞搞实验，物理上跟生产服务器隔绝，用得也心安。 只是 Godaddy Free Products 既然是免费的，同时广告也来了。拿它来建商业站点肯定是不合适的，就是自己人搞实验对着广告也烦。有没有办法去掉？我稍作搜索就有答案：可爱的 css 发挥一下 因为答案来得太容易，没有我发挥的空间总不心甘。于是我又想，我每装一个软件都要去改 css，太烦；有些 一键安装的产品（比如 Free Blogcast 和 Free Photo Album）也不允许我改 css，怎么办？答案是 user css。以 Mozilla Firefox 3.5.5 for Fedora 11 为例，具体做法是： 打开… Continue reading Make best use of Godaddy Free Products
Cross-browser CSS
Today I did something CSS cross-browser testing. Here are some of my findings today. Validate Xhtml / Html before styling. I put form element between table and tr element which make it an invalid xhtml document and cause CSS rendering in a strange way in IE. (IE is generally bad in W3C standards but this… Continue reading Cross-browser CSS
How to center the table
在网页里，如何让整个表格居中？ 我一开始想到的是把<table>嵌套在<div style=”text-align:center”>里，结果发现这样的代码在浏览器里查看表格确实是居中的，但是，同样的代码写成的html邮件表现的就是左对齐（似乎div style=”text-align:center”不起作用）。 为了保证html格式的邮件里的table能居中，我搜寻到了两种方式： 直接用table的align属性：<table align=”center”> (但这不符合W3C XHTML 1.0 Strict规范) 使用css margin:auto：<table style=”margin-left:auto; margin-right:auto”>