+ 2
Suppose I reduced the box width to 50% then what is the code to align the box at the center of the screen?
4 Antworten
+ 3
sorted. thanks!
+ 2
http://stackoverflow.com/questions/396145/how-to-vertically-center-a-div-for-all-browsers
Go through above link. You will find your answers.
+ 1
.class-of-box {
position: relative;
top:50%;
left:50%;
}
Not sure but have a try. I love to write or solve program then design webpage. I am not good at this.
+ 1
If you mean that the "box" is a <div> element with id="box". Then it goes like this when using HTML and CSS:
In HTML:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div id="box"><p>This div with id="box" is centered.</p></div>
</body>
</html>
In CSS:
#box {
width: 50%;
margin-left: auto;
margin-right: auto;
border: 1px black solid;
text-align: center;
}
I added border and text-align just for you to see better that div width is 50% and the div is centered. Also I think that text looks better when centered. :)