<address>
Contact information for an article’s author or a site’s owner.
- Display
- block
- Closing tag
- Required
- Permitted content
- Flow content without headings, sectioning elements,
<header>,<footer>, or<address>
Example
#<footer>
<address>
Have a question about the course? Email us: <a href="mailto:team@codeworlds.com">team@codeworlds.com</a><br>
or call: <a href="tel:+1-212-555-0100">+1 212-555-0100</a>
</address>
</footer>Definition and usage
#The <address> element holds contact information for the person or organization responsible for the content: an email address, a phone number, profile links, an office address. Inside an <article>, it applies to that article’s author; outside one, to the whole page.
Despite its name, it isn’t for marking just any address. A shipping address in an order form, or a conference venue described in an article, are plain paragraphs. Use <address> only when it’s about contacting the content’s author or owner.
It’s most often placed in a page’s or article’s <footer>. It can’t contain headings, sectioning elements (<article>, <section>, <nav>, <aside>), <header>, <footer>, or another <address>. Browsers display it in italics by default.
Syntax
#<address>
…contact information…
</address>Attributes
#This element has no attributes of its own. It supports the global attributes, such as class, id and hidden.
More examples
#<article>
<h2>Five beginner mistakes in CSS</h2>
<p>The most common one is fighting selector specificity.</p>
<footer>
<address>
Author: <a href="/authors/marta-nowak">Marta Nowak</a>
</address>
</footer>
</article>Default CSS
#Most browsers display this element with these default styles:
address {
display: block;
font-style: italic;
}Browser support
#Widely available
Works in all modern browsers, phones included. You can use it without worry.
- Chrome
- Edge
- Firefox
- Safari
Good practices
#- Don’t mark just any mailing address with
<address>, only the contact info of the content’s author or owner. - Use
mailto:andtel:links, so contact is possible with a single tap, on a phone too. - If italics don’t fit your design, turn them off in CSS:
font-style: normal.
Related entries
#- <footer>A page or section’s footer: author, copyright, links, contact info.
- <article>Self-contained content that makes sense read or shared on its own.
- <a>A link to another page, a file, an email address, or a place on the same page.
- <p>A paragraph of text.
- <header>An introduction to a page or section: logo, title, navigation, author info.
Spotted a mistake or missing an example? Write to us.