Warum sind meine Links nicht zentriert unter meinem Bild?

Jeder kann mir sagen, warum meine Links nicht unter meinem Bild zentriert sind? Das center-tag hat zwar für mein bild funktioniert aber für die links keine ahnung warum? Das bringt mich ein bisschen durcheinander.Warum sind meine Links nicht zentriert unter meinem Bild?

<!DOCTYPE html> 
<html> 



<head> 


     <title>PEllisFitness</title> 

     <link href="feel.css" rel="stylesheet" type="text/css" /> 

    </head> 



<body background="wayback.jpg"> 
     <header> 
     <center><img src="Fitness Logo.jpg" alt="Fitness Logo" align="middle" style="border:5px solid black"/></center> 

     </header> 

     <center> 
     <nav> 
     <ul> 
      <li><a href="Home.html">Home</a></li> 
      <li><a href="Diet.html">Diet Plans</a></li> 
      <li><a href="Mass.html">Mass Guide</a></li> 
      <li><a href="Cutting.html">Cuttin Guide</a></li> 
      <li><a href="About.html">About Me</a></li> 
      <li><a href="Contact.html">Contact Info</a></li> 
     </ul> 
     </nav> 

     </center> 

    </body> 

</html>

Quelle

2016-10-09 phillip swag

... wo Sie die Idee, ein ''

Tag zu verwenden gekommen? Das ist super [veraltet] (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/center). Fangen Sie mit einem bestimmten Tutorial oder Lernmaterial an? –

Nein, ich arbeite tatsächlich auf meinem endgültigen aha –

Sie sollten diese CSS für verwenden.
Das Tag <center> ist veraltet.
Im Moment zentrieren Sie die gesamte Liste, nicht die Listenelemente, die das Problem verursachen können. Also, wenn Sie möchten, dass Ihre Links zentriert sind, müssen Sie jede einzelne <li> innerhalb einer <center> wickeln. Hoffe das hilft. Eine bessere Lösung wäre, CSS <ul> hinzuzufügen. Ändern Sie ihn auf

<ul style="display: flex; flex-direction: column; align-items: center;">

Dies wird die Liste ein CSS-Flexbox mit den untergeordneten Elemente angezeigt in einer Spalte und zentriert machen.

Quelle

2016-10-09 04:11:57 Syntac

Ich tat dies in CSS und es hat nicht funktioniert li { \t \t text-align: Zentrum; } –

@phillipswag text-align richtet nur Text innerhalb eines einzelnen Elements oder Elemente ein, die als Inline-, Inline-Block- oder andere textähnliche Anzeigetypen angezeigt werden. Daher kann es hier nicht funktionieren. – Syntac

Haben Sie versucht, eine Tabelle anstelle einer Liste zu verwenden? Sie können die Verknüpfungen in einer Tabelle platzieren, die Tabelle zentrieren und den Text in der Tabelle zentrieren.

Quelle

2016-10-09 04:26:20

Die Verwendung von Tabellen zum Formatieren funktioniert oft genug, sollte aber wirklich vermieden werden, da Tabellen zum Darstellen von Daten verwendet werden sollten, nicht zum Formatieren von Webseiten – Syntac

Verwenden Sie die folgenden Stil in Ihrem UL-Tag für zentrierte Ausrichtung

<ul class="centerNavList">

und

<style> 
.centerNavList { 
    margin: auto; 
    width: 50%; 
    padding: 12px; 
} 
</style>

Quelle

2016-10-09 04:33:23

Sie haben nicht nur Zentrum-Tag zu verwenden, da manchmal arbeitet properly.But nicht die Gewohnheit css nie beatray;). hoffe, es hilft

ul{ 
position:relative; 
display: inline-block; 
list-style: none; 
width:100%; 
text-align: center; 
margin: auto; 
padding: 0; 
}

die Geige sehen center Fiddle

Quelle

2016-10-09 04:37:45

Warum sind meine Links nicht zentriert unter meinem Bild?

Antwort

Verwandte Themen