这样将小div定位在大div中，以后大div大小变化，会引起小div错位吧。还有什么更好的定位方法吗？

Question

*{ margin: 0; padding: 0; font-size: 12px;}#wrap{  width: 1386px;  height: 1014px; margin:20px auto auto auto;} .map{  width: 100%;  height: 100%;  background: url(../images/tz.jpg) repeat-x;  float: top; position:relative} a{ height:23px; line-height:23px; display:block; color:#F3F3F3; text-align:center; text-decoration: none;font-weight:bold;}span{ position:relative; top:-60px; left:-40px;width:100px; height:30px ;font-size:14px; background-color:#D0D0D0; color:#000000; text-align:center;line-height:30px;border-radius:10px;border: 2px solid #000000; display: none;}.A1 a:link,.A2 a:link,.A3 a:link,.A4 a:link,.A5 a:link,.A6 a:link,.A7 a:link,.A8 a:link,.A9 a:link,.A10 a:link,.A11 a:link ,.A12 a:link,.A13 a:link,.A14 a:link,.A15 a:link,.A16 a:link,.A17 a:link,.A18 a:link,.A19 a:link,.A20 a:link,.A21 a:link,.A22 a:link,.A23 a:link{ width:20px; height:20px; background-color:#FF8000; border-radius:23px;  border:3px solid #FFFFFF; position: absolute;}.A1 a:visited,.A2 a:visited,.A3 a:visited,.A4 a:visited,.A5 a:visited,.A6 a:visited,.A7 a:visited,.A8 a:visited,.A9 a:visited,.A10 a:visited,.A11 a:visited ,.A12 a:visited,.A13 a:visited,.A14 a:visited,.A15 a:visited,.A16 a:visited,.A17 a:visited,.A18 a:visited,.A19 a:visited,.A20 a:visited,.A21 a:visited,.A22 a:visited,.A23 a:visited{ width:20px; height:20px; background-color:#8E8E8E; border-radius:23px;border:3px solid #FFFFFF; position: absolute;}.A1 a:hover,.A2 a:hover,.A3 a:hover,.A4 a:hover,.A5 a:hover,.A6 a:hover,.A7 a:hover,.A8 a:hover,.A9 a:hover,.A10 a:hover,.A11 a:hover ,.A12 a:hover,.A13 a:hover,.A14 a:hover,.A15 a:hover,.A16 a:hover,.A17 a:hover,.A18 a:hover,.A19 a:hover,.A20 a:hover,.A21 a:hover,.A22 a:hover,.A23 a:hover{ width:20px; height:20px; background-color:#4A4AFF; border-radius:23px;border:3px solid #FFFFFF; position: absolute;}a:hover span{ display: block;}.A1 a:link{margin: 250px 0px 0px 63px;}.A2 a:link{margin: 82px 0px 0px 268px;}.A3 a:link{margin: 180px 0px 0px 235px;}.A4 a:link{margin: 300px 0px 0px 235px;}.A5 a:link{margin: 470px 0px 0px 235px;}.A6 a:link{margin: 163px 0px 0px 442px;}.A7 a:link{margin: 220px 0px 0px 442px;}.A8 a:link{margin: 234px 0px 0px 585px;}.A9 a:link{margin: 310px 0px 0px 510px;}.A10 a:link{margin: 470px 0px 0px 460px;}.A11 a:link{margin: 168px 0px 0px 756px;}.A12 a:link{margin: 289px 0px 0px 704px;}.A13 a:link{margin: 438px 0px 0px 663px;}.A14 a:link{margin: 556px 0px 0px 663px;}.A15 a:link{margin: 417px 0px 0px 874px;}.A16 a:link{margin: 570px 0px 0px 912px;}.A17 a:link{margin: 0px 0px 0px 0px;}.A18 a:link{margin: 144px 0px 0px 1015px;}.A19 a:link{margin: 367px 0px 0px 1142px;}.A20 a:link{margin: 67px 0px 0px 668px;}.A21 a:link{margin: 385px 0px 0px 580px;}.A22 a:link{margin: 385px 0px 0px 630px;}.A23 a:link{margin: 385px 0px 0px 690px;}备注：Map是个大div，一张地图图片。里面的建筑是小div，A1到A23.我用css画成了个小圆标在了map上，一共23个圆最后位置只写a：link，不写visited和hover可以吗？为什么 “ .办公大楼 a:link”  这种不带  “a:link”  会导致整体错位？另外请问，如何实现当鼠标移到一个div里面li的a链接时改变另一个div的样式。谢谢

Answer 1

也是人才，类名用中文来命名！

Answer 2

前面太一堆了没看出来，最后一个问题你可以写成a:hover{},花括号里写你想让它变的样式

Answer 3

中文命名能识别？

Answer 4

你是用中文写的类名称吗？能识别出来吗