How to Position Caption for Tables in CSS

If you ever happen to need to position caption for a table in CSS, there's a rule for that, called caption-side. No additional rules or markup is needed, just this one:

.bottom {
    caption-side: bottom;
}
caption.css
Copied to clipboard!

By default, this is set to top. It also accepts the following non-standard values:

.non-standard {
    caption-side: left; 
    caption-side: right; 
    caption-side: top-outside; 
    caption-side: bottom-outside; 
}
caption.css
Copied to clipboard!
How to position captions for tables in CSS
If you would like to see more Webtips, follow @flowforfrank

10 Best Practices for Quickly Improving Your CSS

Resources:

Remove ads
Remove ads

📚 Get access to exclusive content

Want to get access to exclusive content? Support webtips with the price of a coffee to get access to tips, checklists, cheatsheets, and much more. ☕

Get access Support us
Remove ads Read more on
Remove ads
Remove ads
🎉 Thank you for subscribing to our newsletter. x This site uses cookies We use cookies to understand visitors and create a better experience for you. By clicking on "Accept", you accept its use. To find out more, please see our privacy policy.