CSS布局问题整理

main{
  text-align:center;
}p{
  display:inline-block;
  *display:inline;/*hack IE*/
  *zoom:1;/*hack IE*/}

.parent{
    display: flex;
    flex-direction: column;//上面两行等同于flex-flow：colomn
    flex-wrap: wrap;// 显示 wrap一行显示不完的时候换行
    height: 440px;
    width: 660px;
}

.main-content {
      width: 60%;
}.main-nav,.main-sidebar {
     -webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
      -moz-box-flex: 1;         /* OLD - Firefox 19- */
      width: 20%;               /* For old syntax, otherwise collapses. */
      -webkit-flex: 1;          /* Chrome */
      -ms-flex: 1;              /* IE 10 */
      flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */}

.container{
   position: fixed;
    left: 0;
    top:0;
    height: 100%;
    width: 100%;
    text-align: center;
}.mask:after{
    content: " ";
    display: inline-block;
    vertical-align: middle;
    height: 100%}.dialog{
    display: inline-block;
    border: 3px solid lightblue;
}

.container{
  display:-webkit-box;
}.left{
  -webkit-box-flex:1;
}.right{
  -webkit-box-flex:1;
}

p{
    white-space:nowrap;
}

p{　　word-wrap: break-word; //性允许长单词或 URL 地址换行到下一行
　　word-break: normal; //让浏览器实现在任意位置的换行}

.nowrap li{
   white-space:nowrap;
   width:100px;
   overflow:hidden;
   text-overflow: ellipsis;
}

{
:;
:;:;
:;
:;
}{
:;
:;
:;
}{
:;
}