如何让同一行上的三个DIV，从左到右排列

< html >
     < head >
         < title > CSS </ title >
     </ head >
     < style  type ="text/css"  rel ="stylesheet" > ...
        * {...}{
            margin:0;
            padding:0;
        }
        #left {...}{
            width:20%;
            float:left;
            clear:right;
            height:20px;
            background-color:yellow;
        }
        #mid{...}{
            width:60%;
            float:left;
            clear:right;
            height:60px;
            background-color:red;
        }
        #right{...}{
            width:20%;
            float:left;
            clear:right;
            height:20px;
            background-color:blue;
        }
     </ style >
     < div  id ="left" ></ div >
     < div  id ="mid" ></ div >
     < div  id ="right" ></ div >
</ html >