2016-05-29 102 views
0

如何對齊<div class="Text">Some text</div>到左側?顯示器彈出對齊到左側

.navigation { 
 
     display: flex; 
 
     align-items: center; 
 
     justify-content: flex-end; 
 
     width: 100%; 
 
     height: 80px; 
 
     background: rgb(255,255,255); 
 
    } 
 
    ul { 
 
     list-style:none; 
 
     /*float:right;*/ 
 
    } 
 
    li { 
 
     display:inline-block; 
 
    } 
 
    a { 
 
     padding: 10px; 
 
     width: 80px; 
 
     text-decoration: none; 
 
     display: block; 
 
     text-align: center; 
 
    } 
 
    a:hover{ 
 
     background:lightgreen; 
 
    }
<div class="navigation"> 
 
    <div class="Text">Some text</div> 
 
    <ul> 
 
     <li><a>Contacts</a></li> 
 
     <li><a>About</a></li> 
 
     <li><a>FAQ</a></li> 
 
     <li><a>Other</a></li> 
 
    </ul> 
 
</div>

+0

你也可以用'證明內容:空間between' https://開頭的jsfiddle達網絡/ Lg0wyt9u/916 / –

回答

2
.Text { 
margin-right: auto; 
} 

應工作

1

使用此片段

.Text { 
    display: flex; 
    justify-content: flex-start; 
    flex-grow: 1; 
}