Introduction

Editors

Basics

HTML Basics

Elements

Attributes

Heading

Paragraph

Text Formatting

Block & Inline Elements

Charsets

Structure & Elements

Lists

Ordered Lists

Unordered Lists

Description Lists

Colors

Links

Images

Favicon

HTML Video

Visuals & Media

Tables

iframes

Layout

File Paths

Layouts & Designs

Forms

Semantics

URL Encoding

Responsive Web Design

Projects for Beginners

Projects & Advanced Topics

Global Attributes

HTML5

HTML5 MathML

DOM Audio/Video

SVG Element

SVG Attribute

SVG Property

Canvas

Tutorial References

JavaScript Programming Course

MERN Full Stack Course

DSA and System Design

HTML Courses

Web Technologies

HTML

DSA / Placements

Data Analytics / Data Science

Development

Cloud / DevOps

Programming Languages

All Courses

Courses

Python

Java

ML & Data Science

Web Development

CS Subjects

DevOps

Software and Tools

School Learning

Tutorials

Interview Corner

Practice DSA

GfG 160

Problem of the Day

Interview Prep

The &lt;center&gt; tag in HTML was used to horizontally center content on a webpage. However, it is deprecated in HTML5 and should no longer be used. Alternatively, we will use the text-align property.[GFGTABS]<gfg-tabs data-run-ide="true" data-mode="light">
 <gfg-tab slot="tab">HTML</gfg-tab>
<gfg-panel slot="panel" data-code-lang="html" data-main-code-start="None" data-main-code-end="None">
 <code class="language-html"><div class=highlight><pre>&lt;!DOCTYPE html&gt;
&lt;html&gt;

&lt;body&gt;
 &lt;center&gt;
 &lt;h3&gt;Welcome to GeeksforGeeks&lt;/h3&gt;
 &lt;p&gt;Hi Geeks&lt;/p&gt;
 &lt;/center&gt;

&lt;/body&gt;

&lt;/html&gt;
</pre></div></code>
</gfg-panel></gfg-tabs>[/GFGTABS]<h3 id="using-css-property" style="text-align:left">Using CSS property</h3>[GFGTABS]<gfg-tabs data-run-ide="true" data-mode="light">
 <gfg-tab slot="tab">HTML</gfg-tab>
<gfg-panel slot="panel" data-code-lang="html" data-main-code-start="None" data-main-code-end="None">
 <code class="language-html"><div class=highlight><pre>&lt;!DOCTYPE html&gt;
&lt;html&gt;

&lt;body&gt;
 &lt;h3 style=&quot;text-align: center&quot;&gt;
 welcome to GeeksforGeeks
 	&lt;/h3&gt;
 &lt;p style=&quot;text-align: center&quot;&gt;
 hi geeks
 &lt;/p&gt;
&lt;/body&gt;

&lt;/html&gt;
</pre></div></code>
</gfg-panel></gfg-tabs>[/GFGTABS] Related Article:<ul><li value="1"><a href="https://www.geeksforgeeks.org/css/css-text-align-property/" target="_blank" rel="noopener">CSS text-align property</a></li></ul>

Your All-in-One Learning Portal: GeeksforGeeks is a comprehensive educational platform that empowers learners across domains-spanning computer science and programming, school education, upskilling, commerce, software tools, competitive exams, and more.

HTML &lt;center&gt; Tag - GeeksforGeeks

HTML &lt;center&gt; Tag

<h2 style="margin-left:0px;">Mastering the HTML &lt;center&gt; Tag</h2>Welcome to our comprehensive guide on the HTML &lt;center&gt; tag! In this video, we’ll show you how to use the &lt;center&gt; tag to center-align content on your web pages. Although the &lt;center&gt; tag is deprecated, understanding its usage and modern alternatives is crucial for creating well-structured and visually appealing web pages.<h3 style="margin-left:0px;">What is the &lt;center&gt; Tag?</h3>The &lt;center&gt; tag in HTML was used to center-align text and other elements. However, it has been deprecated in HTML5 in favor of CSS, which provides more flexibility and control over styling and layout.<h3 style="margin-left:0px;">Why Learn About the &lt;center&gt; Tag?</h3>While the &lt;center&gt; tag is deprecated, it's still important to understand its history and functionality. More importantly, knowing how to achieve the same effect using modern CSS techniques will help you create better, more maintainable web pages.<h3 style="margin-left:0px;">What You'll Learn</h3><h4 style="margin-left:0px;">HTML Structure</h4><ul><li>Basic Syntax: Learn the basic structure of the &lt;center&gt; tag and how it was traditionally used to center content.</li><li>Deprecated Status: Understand why the &lt;center&gt; tag is deprecated and the implications for modern web development.</li></ul><h4 style="margin-left:0px;">Modern Alternatives with CSS</h4><ul><li>CSS text-align: Use the text-align property in CSS to center-align text within an element.</li><li>CSS margin: Discover how to use the margin property to center block-level elements.</li><li>CSS Flexbox: Learn how to use Flexbox for more advanced and flexible centering of both text and block elements.</li><li>CSS Grid: Explore how to use CSS Grid to center content within a grid container.</li></ul><h3 style="margin-left:0px;">Practical Examples</h3><h4 style="margin-left:0px;">Example 1: Centering Text with CSS</h4>Watch as we demonstrate how to center-align text using the text-align property in CSS. This example covers the core concepts and basic implementation.<h4 style="margin-left:0px;">Example 2: Centering Block Elements with CSS</h4>Explore how to center block-level elements using the margin property. Learn how to achieve horizontal and vertical centering for various elements.<h4 style="margin-left:0px;">Example 3: Advanced Centering with Flexbox</h4>Discover the power of Flexbox for centering content. We’ll show you how to create a flexible and responsive layout that centers both text and block elements.<h4 style="margin-left:0px;">Example 4: Centering with CSS Grid</h4>Learn how to use CSS Grid to center content within a grid container, providing a robust solution for complex layouts.<h3 style="margin-left:0px;">Best Practices</h3>User Experience<ul><li>Responsive Design: Ensure your centered content is responsive and adapts well to different screen sizes and devices.</li><li>Accessibility: Follow web accessibility standards to make your centered content usable by all visitors, including those with disabilities.</li></ul>Performance Optimization<ul><li>Efficient Code: Write clean and efficient HTML and CSS code to ensure your centered elements perform well.</li><li>Modern Techniques: Use modern CSS techniques to achieve centering, avoiding deprecated tags for better performance and maintainability.</li></ul>Design Consistency<ul><li>Consistent Styling: Maintain a consistent design that aligns with the rest of your website for a cohesive look.</li><li>Visual Hierarchy: Ensure your centered content fits well within the visual hierarchy of your web page, making it stand out appropriately without overwhelming other elements.</li></ul>For more detailed information, check out our comprehensive guide on GeeksforGeeks: <a href="https://www.geeksforgeeks.org/html-center-tag/">https://www.geeksforgeeks.org/html-center-tag/</a>Enhance your web development skills by mastering modern techniques for centering content in HTML and CSS. Watch this video to gain a deeper understanding and start creating well-structured, visually appealing web pages today. Don't forget to like, share, and subscribe for more in-depth tutorials!

https://videos.geeksforgeeks.org/subtitles/HTMLcenterTag20240529183633.vtt

HTML <center> Tag

https://www.geeksforgeeks.org/videos/html-center-tag/

Mastering the HTML  ltcenter gt TagWelcome to our comprehensive guide on the HTML  ltcenter gt tag In this video, well show you how to use the  ltcenter gt tag to center-align content on your web pages. Although the  ltcenter gt tag is deprecated, understanding its usage and modern alternatives is crucial for creating well-structured and visually appealing web pages.What is the  ltcenter gt Tag?The  ltcenter gt tag in HTML was used to center-align text and other elements. However, it has been deprecated in HTML5 in favor of CSS, which provides more flexibility and control over styling and layout.Why Learn About the  ltcenter gt Tag?While the  ltcenter gt tag is deprecated, its still important to understand its history and functionality. More importantly, knowing how to achieve the same effect using modern CSS techniques will help you create better, more maintainable web pages.What Youll LearnHTML StructureBasic Syntax Learn the basic structure of the  ltcenter gt tag and how it was traditionally used to center content.Deprecated Status Understand why the  ltcenter gt tag is deprecated and the implications for modern web development.Modern Alternatives with CSSCSS text-align Use the text-align property in CSS to center-align text within an element.CSS margin Discover how to use the margin property to center block-level elements.CSS Flexbox Learn how to use Flexbox for more advanced and flexible centering of both text and block elements.CSS Grid Explore how to use CSS Grid to center content within a grid container.Practical ExamplesExample 1 Centering Text with CSSWatch as we demonstrate how to center-align text using the text-align property in CSS. This example covers the core concepts and basic implementation.Example 2 Centering Block Elements with CSSExplore how to center block-level elements using the margin property. Learn how to achieve horizontal and vertical centering for various elements.Example 3 Advanced Centering with FlexboxDiscover the power of Flexbox for centering content. Well show you how to create a flexible and responsive layout that centers both text and block elements.Example 4 Centering with CSS GridLearn how to use CSS Grid to center content within a grid container, providing a robust solution for complex layouts.Best PracticesUser ExperienceResponsive Design Ensure your centered content is responsive and adapts well to different screen sizes and devices.Accessibility Follow web accessibility standards to make your centered content usable by all visitors, including those with disabilities.Performance OptimizationEfficient Code Write clean and efficient HTML and CSS code to ensure your centered elements perform well.Modern Techniques Use modern CSS techniques to achieve centering, avoiding deprecated tags for better performance and maintainability.Design ConsistencyConsistent Styling Maintain a consistent design that aligns with the rest of your website for a cohesive look.Visual Hierarchy Ensure your centered content fits well within the visual hierarchy of your web page, making it stand out appropriately without overwhelming other elements.For more detailed information, check out our comprehensive guide on GeeksforGeeks httpswww.geeksforgeeks.orghtml-center-tagEnhance your web development skills by mastering modern techniques for centering content in HTML and CSS. Watch this video to gain a deeper understanding and start creating well-structured, visually appealing web pages today. Dont forget to like, share, and subscribe for more in-depth tutorials

HTML  Tag

HTML Tutorial

Web Tutorial

Javascript

React

A to Z Guide

Exercises

Projects

Interview Questions

Examples

Color Picker

HTML-Tags

og:title

description

https://www.geeksforgeeks.org/html/html-center-tag/

og:url

HTML5, deprecated HTML tags, CSS properties, text-align property, center content, modern alternatives to center tag, block-level elements, justify-content center, CSS for centering, versatile content alignment, backward compatibility, center-align text, content centering techniques, HTML center tag FAQs

keywords

og:site_name

https://media.geeksforgeeks.org/wp-content/cdn-uploads/gfg_200x200-min.png

og:image

article:section

article:tag

og:type

og:locale

article:published_time

article:modified_time

og:updated_time

og:image:secure_url

og:description

WebTechnologies

Html

HtmlTags

The &amp;lt;center&amp;gt; tag in HTML was used to horizontally center content on a webpage. However, it is deprecated in HTML5 and should no longer be used. Alternatively, we will use the text-align property.HTML&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;body&amp;gt; &amp;lt;center&amp;gt; &amp;lt;h3&amp;gt;Welcome to GeeksforGeeks&amp;lt;/h3&amp;gt; &amp;lt;p&amp;gt;Hi Geeks&amp;lt;/p&amp;gt; &amp;lt;/center&amp;gt; &amp;lt;/body&amp;gt; &amp;lt;/html&amp;gt;Using CSS propertyHTML&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;body&amp;gt;

HTML &amp;lt;center&amp;gt; Tag

GeeksforGeeks

Sandeep Jain

html-center-tag