Center

The element, the attribute, the value.

By Lucy Bixby

Get Started

What is Center?

< Center > is an alignment attribute used in CSS. Its primary function is to bring text to the center of a line on a page. Here is an example of centered text:

Centered lorum ipsum

This can be done with the text-align property in CSS for text groupings like p or h1. Images and blocks can also be centered in CSS by setting the margin-right and margin-left properties to auto (Bos). Center is generally viewed as a stylistic tool for altering the look of content rather than as a building block of the content.

The HTML element (now attribute) Center went through several iterations before becoming what we know it as today. The primary players involved in the element's changes were coders working with browser companies like Netscape and W3C in the 1990s. Each of these companies and individuals had a different idea of what they wanted Center to accomplish and how it should function within an an HTML document. In her book Writing Technologies, theorist Christina Haas explains that many decisions about technology are not made based on what is "better," but rather on politics and other decisions that may be somewhat arbitrary (139-40). This concept is demonstrated by Center's development in Netscape, HTML, and CSS.

A primary contention surrounding its foundations was the question of what an HTML tag should be for. If Center, a design-related tag, was its own element to be placed anywhere in an HTML document, should all design elements have their own tag? This would make HTML cluttered and hard to work with. Many coders at W3C were proponents of moving all design elements into CSS.

But there were good arguments on both sides. CSS still can't achieve certain design features, such as vertical centering, and can be limiting in ways that are different from HTML (Holzschlag). Often, the decisions that were made about the way Center would work in HTML or CSS were based on individuals' personal preferences, as demonstrated by emails sent by W3C coders to one another in the mid-90s. As Pilgrim writes, "The [codes] that win are the ones that ship." Programmer Lou Montulli suggested adding Center as a "body tag" to the "HTML 3 spec," and fellow coder Joe English countered by saying, "If you think they're good ideas, why not submit a formal proposal to the HTML working group? Heck, even an informal proposal would do; Eric Bina just sorta casually asked about background images and the BODY BACKGROUND attribute ended up in the draft spec as a result." Haas's theories in Writing Technologies are supported by the W3C coders: decisions about specifications and other changes often depended upon who got there first or who pushed their idea the hardest, not necessarily on what was more suited to the purpose of the element/attribute/tag. In fact, who could really say what would be best? There are pros and cons to Center's use in both HTML and CSS. When a gray area exists, seemingly arbitrary factors must weigh in to ensure a decision, good or bad, is made in the end.

Christina Haas also writes about how technology is often viewed in too-simple terms in her article "On the Relationship Between Old and New Technologies." To an outside observer, it may seem like HTML 3.2 swiftly and thoroughly replaced NHTML extensions, and then CSS style sheets did the same to the extensions in HTML 4.0. However, this way of thinking is an example of Haas's "simple replacement model," which imagines a very linear progression in terms of technological advancement and replacement (Haas 210). In fact, due to the fact that old and new versions of browsers render code differently, at times it is necessary for CSS and deprecated HTML elements to work together as well.

For example, to create this website, I wanted some paragraphs to be left-aligned and some to be centered. While there may be a way to achieve this in CSS, I was not sure what it could be. Therefore, I used CSS to set the text-align element for paragraphs to "left," and used "Center" tags on a few paragraphs within the HTML. The webpage looks just the way I wanted it to, and works perfectly well. The continued coexistence of the Center CSS attribute and HTML element supports Haas's posit that old and new technologies often work in tandem with one another instead of a better, new technology swooping in and obliterating all traces of the old technology (210). The way Center is used in coding has been determined over the years by a series of professional figures in the industry as well as by public opinion. This report will trace the history of Center and the contentions surrounding its birth and development.

Top / Next

History and Contentions

Center Origins: Netscape

In the early days of HTML, its use was primarily placing content on a page. The focus was not on the style or visual qualities of the content, and in fact industry professionals were extremely adamant about this (Pollack). They preferred to keep HTML as simple and basic as possible. But before long, designers started thinking more about these visuals. Before the advent of style sheets, HTML was a good channel for changing the look of the content through coded elements. Designers asked themselves how they could move text and other objects around on a page to create a balanced, appealing layout and a hierarchy for readers to know which text is most important to focus on. Unlike the "purist" coders, early designers pursued a goal of setting apart text and objects on a page.

Center was originally conceived in NHTML, or Netscape-HTML. Netscape Communications Corp. was a browser company that developed their own code--some of which was similar enough to HTML to function as HTML "extensions" in the Netscape browser, Navigator ("HTML 3.2 and Netscape 3.0: Block Elements"). Center was a familiar concept from printed text and allowed users to highlight content by changing its alignment. HTML 3.0 was working on a "P align=center" tag, but Netscape's version simplified this idea down to just "Center" (Pollack). The alignment extensions and other visual elements from Netscape, like Center, eventually caught on enough that they were adopted by the W3C following an agreement by the large browser companies to standardize HTML (Raggett, "A History of HTML").

HTML 3.2

Released in 1997, the collaborative HTML version 3.2 used Center as a block element enclosed by brackets that could be inserted into a portion of text to change the alignment (Korpela). The alignment of images could be adjusted using the align attribute and a value of middle, top, bottom, left, or right (Raggett, "HTML 3.2"). In order to center a larger segment of a webpage, designers could also use the DIV element with the attribute Align and a value of Center ("HTML 3.2 and Netscape 3.0: Block Elements.").

center tag div center

This allowed a lot of freedom with how and where designers could center text or other objects, but it could clutter up an HTML file with stylistic code (Sanders).

Initially, there was some contention over the Netscape extensions that eventually migrated into HTML. Many who were familiar with the industry felt that they were a disorganized way of offering layout customization (Sanders). While Netscape's extensions were appealing to the general public because they allowed designers to change the way a page looked, they also limited style options because they merely "[mimicked] the most popular fraction of style sheets' functionality" (Pollack). Style sheets, though yet to really be established, were an idea preferable to coders to the "creeping featurism" that would result from "adding random tags as we see fit" (Sanders). Many W3C coders wanted to maintain HTML's original function and purpose: organizing content, not designing it (Pollack).

On the other side, some saw the benefits of the Netscape extensions. They were usable by multiple browsers; the public liked them; and overall they could be a positive addition to HTML coding (Montulli "NCSA Mosaic", Preece).

Netscape stirred up some controversy by stating that their extensions were actually part of the HTML 3.0 specifications (Montulli "NCSA Mosaic"). Lou Montulli made a proposal to Dave Raggett and "whoever else...would listen" to actually add these extensions to the HTML 3.0 spec (Montulli "NCSA Mosaic"). Montulli was a "founding engineer" at Netscape, and in fact was still working at Netscape with the position of a "representative to the W3C" at the time HTML 3.2 was in development (Montulli "Lou Montulli"). He viewed Center and other NHTML tags from the perspective of someone who helped create them. The reasons behind Netscape adding the tags to their browser--greater freedom of design, more options for adding visuals to a webpage--were in Montulli's mind as he proposed adding the tags to the HTML spec. Netscape's extensions worked for the crossection public that needed them. Ultimately, because of proposals like Montulli's, they were added.

CSS

Even so, style sheets still seemed like the ideal channel for elements like the "notorious" Center (Batchelor, Sanders). As stylistic HTML elements gave way to style sheets and CSS was developed and released, Center was deprecated from HTML 4.0 and added to CSS, where it serves as an attribute for text-align ("Alignment, Font Styles, and Horizontal Rules"). This allows stylistic and visual decisions for a page, in this case regarding alignment for text, to all be located in one style sheet rather than scattered throughout the HTML of a document (Sanders).

Centering in CSS

However, certain tasks such as centering an object vertically are complicated to execute in CSS because of the rules that hold CSS in place (Holzschlag). Additionally, HTML documents like emails did not translate well into the world of CSS; it is often still preferable in these scenarios to utilize depreciated elements like Center than to try to write CSS into something like an email ("HTML Email Design").

Vertical centering in CSS

To an outside observer, it may seem like HTML 3.2 swiftly and thoroughly replaced NHTML extensions, and then CSS style sheets did the same to the extensions in HTML 4.0. Because of CSS's purpose, it is more practical for designers to work "top-down" by developing CSS styles and then worrying about whether or not those decisions would be displayed correctly in an older browser (Fahrner, Lilley). However, especially in the early days of CSS, because of browser inconsistency it was tempting for designers to work in the same way they had with HTML 3.2 and write everything as elements in the HTML, ignoring CSS, cluttered as this process may be (Fahrner). The "transitional" HTML 4.01 and XHTML 1.0 allowed the use of deprecated elements, which does not equal "disallowed" (Cabaniss, Navarro). Browsers and HTML versions continue marching towards consistency in the way CSS codes are displayed in order to promote the use of CSS, but for a time it was necessary to allow the option for designers to utilize both the old elements and the new CSS attributes. Christina Haas's simple replacement model is represented in that the transitions between Center's function in NHTML, HTML, and CSS were not immediate or all-encompassing. Old and new technologies worked together to develop the way that code is written today.

Top / Next

Print Media

The decisions made about HTML and CSS by industry professionals have helped to determine the way that Center and other design tags are used in web media. In CSS, more options are available for using specific units and attributes to adjust the way an object looks on the page. It is much easier to center all headings, or all paragraphs, etc, using CSS than to go around adding Center elements to every single paragraph or heading as HTML required. Content is effectively separated from style with the implementation of CSS. Style sheets give the unique opportunity to make sweeping alterations and to view a web document from two different perspectives: the design (CSS) and the text (HTML). Since CSS has lasted this long, it seems like it is a good medium for both those who want options related to website design, like Lou Montulli, and those who want to keep design out of HTML, like several of the W3C original coders.

Now that Center is comfortably established in CSS, writers can focus on how it should be used. Printed books and documents tend to use centered text mainly for headings, titles, dedications, quotes, or other objects that are meant to stand out or look apart (Digital Relativity). But even things that use Center acceptably, like poetry, may be better off when using left-align, as centering large blocks of text can appear childish rather than professional (Digital Relativity). Center can also draw unnecessary attention to text due to flaws like uneven beginnings of lines (Anthony). While the public of the 90s loved the ability to use Center in their Netscape and HTML codes, it is questionable whether using it is often the best choice.

In print, centering text is used to draw the eye to something important or different. Titles are typically centered, especially when they are the focal point of an elaborately designed cover. Centering creates a balance on the page, and a designer can deliberately break this rule based on the look they want to achieve. For example, a chapter title may be left-aligned to make it stand out less or appear more streamlined with the rest of the text. In the case of the covers pictured below, the left-aligned title imitates the chaotic, uncanny feeling of the novel the cover represents, while the centered title reinforces the stability and balance of the government building pictured underneath it.

Left-aligned book cover Centered book cover

Similarly, block quotes or other elements of writing that are out of the ordinary tend to use centering to help the reader separate them from the rest of the text more easily.

But modern internet style doesn't seem to abide as closely by these print media guidelines. Facebook and Twitter, two very popular social media platforms, are solidly in the left-alignment camp. Yahoo's homepage uses only a minimally-larger amount of centered text. Google uses centering for its homepage--but as soon as you search a term, everything switches over to left-align.

Left-aligned book cover

The following is an example of centered text that is considered bad form in the online community ("Web Blooper of the Month"). It is harder to read than left-aligned text because the lines do not start in the same place. In his book Designing Web Usability, Jakob Nielsen says, "By having a steady starting point for the eye to start scanning, the user can read much faster than when faced with centered or right-justified text. Of course, it is acceptable to center or right-justify a few lines for effect, but one should not do so for blocks of text" (126).

lots

The negativity thrown in Center's direction is discouraging. Centered text is called "boring" and "weak" ("Centered Text," Johnson). In print media as well, blanket statements are made for important documents like resumes--"Don't center any of your text" (Zhang). But there are ways to make a page look nice and balanced using Center along with other tools that help the beginning of lines keep from being jagged or difficult to read ("Centered Text"). Overall, a mix of alignments can look really great on a web page, and centering can be a good thing when a designer is using it for a limited amount of text and has a purpose in mind (Cousins). It takes a good designer and a few best practices to know which alignment rules to follow and to figure out what looks the best and is most readable.

Christina Haas's theories regarding the simple replacement model and decisions based on politics held true throughout the many steps that Center took to reach its current position in CSS. Old technologies like print media and depreciated versions of HTML tags continue to impact how web pages are built and designed today, as do decisions made by those involved in the beginning of HTML's development based on factors such as who had the most influence and who had the motivation to make suggestions. Center is a changing technology that has gone in the course of two decades from a significant NHTML tag to being disfavored by web design experts. It represents layers of web history and development in its format and usage.

Top / Works Cited

Works Cited

"Alignment, Font Styles, and Horizontal Rules." HTML 4.02 Specification. Ed. Dave Raggett, Arnaud Le Hors, and Ian Jacobs. W3C, 1999. Web. 23 Oct. 2015.

Anthony. "Why You Should Never Center Align Paragraph Text." Uxmovement.com. UX Movement, 19 Jan. 2011. Web. 25 Oct. 2015.

Batchelor, Mike. "NCSA Mosaic, Netscape, and HTML3." Lists.W3C.org. W3C, 18 July 1995. Web. 25 Oct. 2015.

Bos, Bert. "Centering Things." Web Style Sheets: CSS Tips and Tricks. W3C, 3 Sept. 2015. Web. 23 Oct. 2015.

Cabaniss, Jelks. "Complain on Center." Lists.W3C.org. W3C, 30 Mar. 2000. Web. 25 Oct. 2015.

"Centered Text." Practicaltypography.com. Practical Typography. Web. 25 Oct. 2015.

Cousins, Carrie. "Line That Up." Tympanus.net. Codrops, 19 June 2012. Web. 25 Oct. 2015.

Digital Relativity. "Ooh, Center Align! Fancy! Wait... Text Alignment Rules?" DigitalRelativity.com. Digital Relativity, 18 Dec. 2013. Web. 25 Oct. 2015.

English, Joe. "NCSA Mosaic, Netscape, and HTML3." Lists.W3C.org. W3C, 18 July 1995. Web. 25 Oct. 2015.

Fahrner, Todd. "CSS and Presentational Markup." Lists.W3C.org. W3C, 5 June 1997. Web. 25 Oct. 2015.

Haas, Christina. "On the Relationship Between Old and New Technologies." Computers and Composition 16 (1999): 209-28. Web. 25 Oct. 2015.

Haas, Christina. "Social Dynamics, or Scientific Truth, or Sheer Human Cussedness." Writing Technology. 1st ed. New York: Routledge, 1995. 137-65. Web. 25 Oct. 2015.

Holzschlag, Molly. "Seven Things Still Missing from CSS." Creative Bloq. Future PLC, 5 Jan. 2012. Web. 23 Oct. 2015.

"HTML 3.2 and Netscape 3.0: Block Elements." Webreference.com. Web Reference, 14 Apr. 1996. Web. 23 Oct. 2015.

"HTML Email Design | < Center > Tag." Team Treehouse. Treehouse, 2013. Web. 11 Dec. 2015.

Johnson, Joshua. "How to Use Centered Alignments." Designshack.net. Design Shack, 8 Feb. 2013. Web. 25 Oct. 2015.

Korpela, Jukka. "Center." Learning HTML 3.2 by Examples. Tampere University of Technology, 16 Dec. 2010. Web. 23 Oct. 2015.

Lilley, Chris. "CSS and Presentational Markup." Lists.W3C.org. W3C, 6 June 1997. Web. 25 Oct. 2015.

Lloyd, Ian. "Center." Reference. SitePoint. Web. 25 Oct. 2015.

Montulli, Lou. "Lou Montulli." Montulli.org. Google Sites, 2015. Web. 9 Dec. 2015.

Montulli, Lou. "NCSA Mosaic, Netscape, and HTML3." Lists.W3C.org. W3C, 18 July 1995. Web. 25 Oct. 2015.

Navarro, Ann. "HTML Deprecation." Lists.W3C.org. W3C, 24 Mar. 1999. Web. 25 Oct. 2015.

"Netscape HTML." Angelibrary.com. Angelibrary, 1999. Web. 23 Oct. 2015.

Nielsen, Jakob. Designing Web Usability. San Francisco: New Riders, 2000. Print.

Pilgrim, Mark. "How Did We Get Here?" DiveIntoHTML5.org. Dive Into HTML5, 2011. Web. 8 Dec. 2015.

Pollack, Paul. "NHTML: What Doesn't Work." JNOCook.net. Web. 23 Oct. 2015.

Preece, Scott E. "NCSA Mosaic, Netscape, and HTML3." Lists.W3C.org. W3C, 19 July 1995. Web. 25 Oct. 2015.

Raggett, Dave. "HTML 3.2 Reference Specification." W3C.org. W3C, 14 Jan. 1997. Web. 24 Oct. 2015.

Raggett, Dave, Jenny Lam, Ian Alexander, and Michael Kmiec. "A History of HTML." Raggett on HTML 4. Harlow: Addison Wesley Longman, 1998. W3.org. W3C, 1998. Web. 23 Oct. 2015.

Sanders, Tony. "CENTER Element." 1997.WebHistory. 1997 Web History, 21 Oct. 1994. Web. 23 Oct. 2015.

"Web Blooper of the Month." UIWizards.com. UI Wizards, Jan. 2003. Web. 25 Oct. 2015.

Zhang, Lily. "12 Tiny Changes That Make Your Resume Easy for Recruiters to Skim." Themuse.com. The Muse, 2015. Web. 25 Oct. 2015.

Top