
- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to horizontally center a <div> in another <div>?
Here I have one html form and one css file(style.css).”o-div” is the outer div and “i-div“is the inner div class.
Example
<html > <head> <title>center a div</title> <link href="../../Content/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="o-div"> I am OUTER DIV <div class="i-div"> I am INNER DIV, I am in Center </div> </div> </body> </html>
Output
I am OUTER DIV I am INNER DIV, I am in Center
Style.css
body { background-color:Gray; padding:30px; } .o-div { padding:50px; background-color:Lime; } .i-div { background-color:Fuchsia; max-width:400px; height:200px; margin: 0 auto; text-align:center; }
- Related Questions & Answers
- How do I center <div> tag using CSS?
- Selects all <p> elements inside <div> elements with CSS
- Display <div> or <span> over image on :hover in HTML
- What is the difference between HTML tags <div> and <span>?
- Selects all <div> elements and all <p> elements with CSS
- '></a></li></ul><i>xssi</i>
- Selects all <p> elements where the parent is a <div> element with CSS
- HTML <center> Tag
- How to load external HTML into a <div> using jQuery?
- Difference between <ion-list> and <div class=“list”> in Ionic framework?
- Selects all <p> elements that are placed immediately after <div> elements with CSS
- Passing mouse clicks through an overlaying HTML element <div>
- How can I remove everything inside of a <div> using jQuery?
- How do we style HTML elements using the division tag <div>?
- How we can put two divisions <div> side by side in HTML?
Advertisements