Я написал следующий код на html и css: <html> <head> <title>Сайт о часах</title> <style> *{ padding:0; margin:0; } ul{ height:60px; width:700px; margin-left:400px; border:5px solid black; } li{ display:block; list-style-type:none; float:left; margin-left:30px; margin-top:15px; } a:link{ background-color:white; color:black; border:2px solid black; padding:5px 10px 5px 10px; display:inline-block; } a:visited{ background-color:white; color:black; border:2px solid black; padding:5px 10px 5px 10px; display:inline-block; } a:hover{ background-color:green; color:white; border:2px solid black; padding:5px 10px 5px 10px; display:inline-block; } a:active{ background-color:white; color:black; border:2px solid black; padding:5px 10px 5px 10px; display:inline-block; } </style> </head> <body> <ul> <li><a href="Casio.html">Часы Casio</a></li> <li><a href="Burett.html">Часы Burett</a></li> <li><a href="Orient.html">Часы Orient</a></li> <li><a href="Fossil.html">Часы Fossil</a></li> <li><a href="Rolex.html">Часы Rolex</a></li> </ul> </body> </html> Почему, когда я убираю в селекторе ul следующий код height:60px; width:700px; то рамка вокруг меню исчезает и появляется одна прямая линия?И ведь по определению "Блочный элемент занимает всю доступную ширину, высота элемента определяется его содержимым, и он всегда начинается с новой строки". То есть по этому определению высота блочного элемента UL определяется его содержимым, а в данном случае это содержимое - меню. То есть рамка должна огибать меню. Почему не так?
