Come centrare Footer Widgets

January 16

Uno dei modi più veloci dal centro un gruppo di oggetti in una pagina web è quello di metterli in un contenitore. Widget, per esempio, sono disponibili in diverse dimensioni e forme. Molti siti come Facebook, Twitter, Amazon e anche il governo degli Stati Uniti danno widget via gratis. Se si dispone di widget che si desidera visualizzare nella sezione piè di pagina Web aggiungerli ad un div contenitore e usare i CSS per lo stile vostro div.

istruzione

1 Avviare un editor di testo o editor HTML e aprire un documento HTML. Trova la sezione stile del documento e incollare il seguente codice all'interno di tale sezione:

.footer {bottom: 0px; width: 100%; bottom: 5px; position: absolute; text-align: center;}

.widgets {float: left; width: 100%; margin: 0 auto;}

La classe .footer CSS definisce gli attributi del piè di pagina Web. il valore dell'attributo text-align è "centro". Questo consente ai browser di centrare qualsiasi cosa all'interno del piè di pagina. La classe .widgets definisce gli attributi del contenitore div che contiene i widget. L'attributo float - il cui valore è "sinistra" - assicura che più widget nella div siedono accanto all'altro. L'attributo più importante è il margine. Dandogli un valore "0 Auto" si forza browser per centrare i widget all'interno del loro div contenitore.

2 Aggiungere il seguente codice HTML nella sezione corpo del documento:

<Div class = "footer">
<div class = "widget">
INSERT WIDGET QUI
INSERT WIDGET QUI
</ Div>

La prima riga di codice crea il div piè di pagina. Si fa riferimento alla classe di piè di pagina descritto nel paragrafo precedente. La seconda div fa riferimento la classe widget. Questo div si trova all'interno del div piè di pagina. Sostituire le due linee con la scritta "INSERT WIDGET QUI" con due dei tuoi widget.

3 Salvare il documento e visualizzarlo nel browser. I widget appariranno centrato nella parte inferiore della pagina nel piè di pagina della pagina.

4 Aggiungere i widget aggiuntivi per il div che contiene i widget. Visualizzare la pagina Web in un browser dopo l'aggiunta di altri widget per assicurarsi di non aggiungere troppi. Se lo fai, si defluire il lato destro della pagina e far comparire una barra di scorrimento orizzontale.