如何开发100%兼容浏览器的基于CSS的布局？
我们正在为各种外部和内部网站创建一些布局 其中一个开发人员正在使用基于用户代理切换CSS文件（一个用于FF，一个用于IE）的非最佳实践<代码>：/其他人坚持使用基于表格的布局，因为它们与浏览器兼容 我想要一些关于如何使用CSS来布局和安排元素的小指导。这必须与浏览器兼容。网格布局或“CSS框架”不能使用，因为它们对于此处所做的工作不灵活 例如，如果我们收到一家外部设计公司提供的90像素宽的图像，我们不会将它们放入一个60像素宽的网格单元中。我们不会调整它们的大小以适应。如果公司设计主页，点击一个链接，看到所有的填充标志/图形都缩小了，这看起来很愚蠢 需要一些资源或建议来为我指明正确的方向 编辑：这里是添加的扭曲。我们不接触任何HTML，我们使用JSF和Oracle ADF中基于组件的设计。。。他们将呈现HTML，我们使用CSS来对齐和设置样式如何开发100%兼容浏览器的基于CSS的布局？,css,jsf,Css,Jsf,我们正在为各种外部和内部网站创建一些布局 其中一个开发人员正在使用基于用户代理切换CSS文件（一个用于FF，一个用于IE）的非最佳实践：/其他人坚持使用基于表格的布局，因为它们与浏览器兼容 我想要一些关于如何使用CSS来布局和安排元素的小指导。这必须与浏览器兼容。网格布局或“CSS框架”不能使用，因为它们对于此处所做的工作不灵活 例如，如果我们收到一家外部设计公司提供的90像素宽的图像，我们不会将它们放入一个60像素宽的网格单元中。我们不会调整它们的大小以适应。如果公司设计主页，点击一个链接，看
Edit2：我们可以在呈现HTML之前向其添加样式和属性。请记住，我们没有正在编辑的.html文件，它是由组件生成的。就布局而言，您可以看到此站点是否是一个好的参考 还有一些框架，例如
雅虎也有更复杂的方法。让布局在不同浏览器间工作的唯一真正方法是花时间在每个浏览器上进行测试。不同版本的IE都有自己的特殊问题，所以使用条件注释为它们提供额外的样式表 从良好的语义有效的HTML开始，不要尝试太复杂的布局，你会没事的
如果你不想使用CSS库/框架，那就需要体验和测试。现在一种常见的方法是编写CSS，使其适用于Firefox（和其他现代非IE浏览器），然后使用添加IE特定的修复程序 不幸的是，任何不简单的页面布局都会在IE6和IE7中遇到bug，而这些bug只能通过给浏览器提供稍微不同的CSS来解决
在一天结束时，你必须在所有你瞄准的浏览器中测试你的HTML/CSS；这真的是无可替代的。100%浏览器兼容性？听起来你需要一些邪恶的恶魔魔法和/或大量的诅咒和哭泣 如果您不想使用任何类型的网格布局或CSS框架，那么您将不得不进行大量的尝试和错误，并检查浏览器之间的差异
祝你好运。你会需要它。100%的浏览器兼容网站可能主要来自于经验和尝试与错误相结合——主要是。随着IE8的推出，它变得更加容易，因为它（至少）完全符合CSS2。不过，您仍然希望IE7和IE6能够正常工作。彻底的测试是至关重要的 请记住，100%的浏览器兼容性并不一定意味着它们必须看起来完全相同（）。对于复杂的布局，应该接受细微的差异，并且可能需要一段时间 以下是一些值得一看的链接：
从坚实、有效、语义（有意义）（X）HTML标记开始。从标记的角度来看，保持简单。使用著名的CSS库/框架。测试，测试，测试 无法创建一个在所有浏览器中都100%兼容的基于CSS的布局，因为有些浏览器无法通过测试。事实上，大多数浏览器都没有通过这个测试 您只能希望在所有浏览器上都能看到好看的东西（或者在有bug和/或“功能”的浏览器上会优雅地退化）
这是出于设计：CSS从来没有让所有浏览器上的东西看起来都一样，它只是告诉浏览器你想要什么的一种方式。浏览器开发人员完全可以自由地根据您的意愿进行操作。浏览器的呈现方式不同。拥有干净、独立的CSS文件并不是一件坏事，而不是在每个浏览器中“几乎可以工作”的单个文件 虽然很少见，但是有一个时间和一个地方可以摆桌子，你只需要选择什么时候可以。当开发人员的时间和用户界面为了“最佳实践不使用表”而做出合理的牺牲时，您不一定是赢家 每种布局的细微差别都是如此之大，以至于浏览器错误（/差异）无法准确预测——尽管有些比其他更常见 我提到差异和bug，因为很多浏览器之间不一致的地方都是由于对HTML标准的不同而且可能同样有效的解释 关于浏览器兼容性的指导，除了测试、测试、测试之外，没有其他解决方案 安装尽可能多的浏览器（FF、Chrome、IE、Safari、Flock、Opera等）。但是保持不同浏览器的不同版本同时运行会变得很棘手。这是像browsercam.com（商业）和browsershots.org（免费）这样的网站派上用场的地方。它们以您所能想到的浏览器/操作系统组合的形式为您的网站拍摄快照 实际上，Browsercam.com可以让你登录到机器上，也可以在网站上玩，这可以方便地调试交互式CSS和JS 我的建议是：
- 读几本关于CSS的书
- 检查以确保您没有使用任何特定于浏览器的内容（如果您不确定，请检查所有内容