再学一下css最初级的一些选择器（比如*、.class、#、属性）等 ，后代选择器及其之后的先暂时不看，接收太多消化不了。
然后直接去学盒子模型，再去看个盒子模型的实战演示。这个时候你就大致知道div+css怎么用了
然后css有很多样式，比如边框啊背景啊文本样式啊链接样式，这些可以慢慢来，实际中要用到的时候再学，一股脑学了不见得能接收，就算听懂了，等到要用的时候你又呆住了，又要重新看一遍。
顺便宣传一下咱们公司新设立的前端培训项目，10年前端老司机一对一教学。
不要两万，不要9888，只要4800，想了解私信我噢
做多了就懂了,<br>一般div+css的书,在一开始,就有简单的概括,如它会解释框模型……,你没认真去看,出现错位一般是你没理解(clear或overflow)属性的用法，这个在框模型里是有提到的，clear
overflow的用法，这个是最基本的（css里出现频率很高的属性，），一定要会用（和表格不一样，div一般是浮动布局的，用了float,块就脱离了文档流了，就是说这个块里的东西不占文档流，那就要懂得用clear或overflow配合处理。css书的后面一般会提css的bug
及一些解决方法，要去体会。<br>
<br>IE7
ff是按标准模式来解释的,新的浏览器会向后兼容,它留有老的那种解释模式,叫怪异模式,这个在很多浏览器上基本一样,你看下百度的代码.头部少了什么（怪了，以前没有现在有了<!DOCTYPE
HTML
PUBLIC
"-//W3C//DTD
HTML
4.01
Transitional//EN">。你看首页吧）.当头部没这些东西时.浏览器会以怪异模式来解释网页.那你按IE5.0的标准来做网页就可以了.基本兼容大部分浏览器,<br>
<br>用标准模式兼容大部分浏览器,也不是很难,你多做几个模板,慢慢就懂了.看来div+css麻烦,不是的.这些bug用表格布局同样有.只是不明显,你没去注意.如一个表格做的网站在IE7.0和IE6.0它的间隙和你规定的不一样等等,很多问题……
div和CSS最好多学习方式就是多练习，在练习中掌握经验、技巧，很多很多的知识，需要自己实践后体会，书里是不会讲到的。然后你说的兼容问题，不止你老火，所有做网页的，刚开始，都被这个折磨过。（祈祷ie8以下的ie浏览器全部绝迹）熟练掌握运用下面说的方法，就OK了。
解决兼容问题靠经验积累，靠CSS hack！你去百度搜索下CSS hack，百度百科介绍的很详细。
CSS hack简单讲，就是针对不同浏览器写不同css，比如说ie6的hack，意思就是这段css写法，只有在ie6会执行，其他浏览不会执行，这样就能针对不同浏览器写不同的css，达到兼容。
附上一些CSS hack给你参考
#test{
color:red/* 所有浏览器都支持 */
color:red !important/* Firefox、IE7支持 */
_color:red/* IE6支持 */
*color:red/* IE6、IE7支持 */
*+color:red/* IE7支持 */
color:red\9/* IE6、IE7、IE8支持 */
color:red\0/* IE8支持 */
}
body:nth-of-type(1) p{color:red} /* Chrome、Safari支持 */
*+html .list1 li{line-height:18px} //IE7hack
/* Firefox 1 - 2 */
body:empty #firefox12
{display: block}
/* Firefox */
@-moz-document url-prefix()
{#firefox { display: block}}
/* Webkit-Safari-Chrome */
@media screen and (-webkit-min-device-pixel-ratio:0){
color:red
}
/* Opera */
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0)
{head~body #opera { display: block}}
