CSS布局:居左之后居右是100%宽度显示问题

　　下面这段代码是个常见的问题，解决的办法也有多个，最近发现一种放，放上来和大家讨论一下：

　　问题代码：

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
title new document /title
style type="text/css" media="screen"
!--
#content { overflow: hidden; zoom: 1; }
#left { float: left; width: 200px; }
#right { background: #FFC8D0; }
--
/style
/head
body
div id="content"
    div id="left"
    left - webjx.com
    /div
    div id="right"
    right - webjx.com
    /div
/div
/body
/html

解决后CSS：

#content { overflow: hidden; zoom: 1; }
#left { float: left; width: 200px;   }
#right { background: #FFC8D0;overflow: hidden; zoom: 1;  }

查看运行效果：

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"html xmlns="http://www.w3.org/1999/xhtml"headtitle new document /titlestyle type="text/css" media="screen"!--#content { overflow: hidden; zoom: 1; }#left { float: left; width: 200px; }#right { background: #FFC8D0;overflow: hidden; zoom: 1; }--/style/headbodydiv id="content"div id="left"left - webjx.com/divdiv id="right"right - webjx.com/div/div/body/html
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]