Versuchen, Text nebeneinander in Fußzeile zu verschieben

Question

Wie kann ich Text nebeneinander in meiner Fußzeile verschieben? Ich versuche, 3 Spalten nebeneinander zu haben und im Moment habe ich nur eine Spalte und ich kann nicht herausfinden, wie man zwei andere daneben bekommt.

Geschäft und Lernen
Mac

<br><a href="footer.html">iPad</a> 

    <br><a href="footer.html">iPhone</a> 

    <br><a href="footer.html">Watch</a> 

    <br><a href="footer.html">TV</a> 

    <br><a href="footer.html">Music</a> 

    <br><a href="footer.html">iTunes</a> 

    <br><a href="footer.html">iPad</a> 

    <br><a href="footer.html">Accessories</a> 

    <br><a href="footer.html">Gift Cards</a> 

Answer 1

Versuchen Sie, die column-count CSS-Eigenschaft. Unten Beispiel

<ul style="-webkit-column-count: 3;-moz-column-count: 3;column-count: 3;"> 
 
    <li><a href="footer.html">iPad</a> 
 
    </li> 
 
    <li><a href="footer.html">iPhone</a> 
 
    </li> 
 
    <li><a href="footer.html">Watch</a> 
 
    </li> 
 
    <li><a href="footer.html">TV</a> 
 
    </li> 
 
    <li><a href="footer.html">Music</a> 
 
    </li> 
 
    <li><a href="footer.html">iTunes</a> 
 
    </li> 
 
    <li><a href="footer.html">iPad</a> 
 
    </li> 
 
    <li><a href="footer.html">Accessories</a> 
 
    </li> 
 
    <li><a href="footer.html">Gift Cards</a> 
 
    </li> 
 
</ul>

Answer 2

Erstens teilen die Links ...

<div class="linklist"> 
<a href="footer.html">iPad</a><br> 
<a href="footer.html">iPhone</a><br> 
<a href="footer.html">Watch</a><br> 
</div> 

<div class="linklist"> 
<a href="footer.html">TV</a><br> 
<a href="footer.html">Music</a><br> 
<a href="footer.html">iTunes</a><br> 
</div> 

<div class="linklist"> 
<a href="footer.html">iPad</a><br> 
<a href="footer.html">Accessories</a><br> 
<a href="footer.html">Gift Cards</a><br> 
</div> 

Und dann der Art!

Erweitern Sie auf die CSS jedoch passt, aber dies wird die Links zwischen drei Spalten aufgeteilt. :)

Answer 3

ein paar divs Fügen Sie den Inhalt zu teilen und einige CSS hinzufügen, es auszurichten, wie

<div class="col">  
     <a>content</a>  
     <a>content</a>  
     <a>content</a>  
    </div>  
    <div class="col">  
     <a>content</a>  
     <a>content</a> 
     <a>content</a> 
    </div>  
    <div class="col"> 
     <a>content</a> 
     <a>content</a>  
     <a>content</a> 
    </div> 

nun die CSS-Set erforderlich:

.col{ 
     width: 33%; 
     float: left; 
    } 
    .col a{ 
     float: left; 
     width: 100%; 
     margin: 2px; 
    } 

Ich habe es nicht getestet, Schreiben auf meinem Handy. Ich hoffe es hilft!

Answer 4

<a href="footer.html" class = "col1">iPad</a> 
    <a href="footer.html" class = "col2">iPhone</a> 
    <a href="footer.html" class = "col3">Watch</a> <br/> 
    <a href="footer.html" class = "col1">TV</a> 
    <a href="footer.html" class = "col2">Music</a> 
    <a href="footer.html" class = "col3">iTunes</a> 

CSS Styles: .col1

{ 
       position: relative; 
       float: left; 
       margin-right: 50px; 
      } 
      .col2 
      { 
       float: left; 
       margin-right: 50px; 
      } 
      .col3 
      { 
       float: left; 
       margin-right: 50px; 
      } 

Hope this geholfen. Sie können viele Antworten im Stapelüberlauf sowie in Google finden.