I want to make a rectangule and text (centered) inside it A few sample sites of rectangles with text centered that I have found are
<!-- m --><a class="postlink" href="http://www.sony.com/vaiopeople">http://www.sony.com/vaiopeople</a><!-- m -->.
<!-- m --><a class="postlink" href="http://www.register.com/index.cgi?1|3784143410">http://www.register.com/index.cgi?1|3784143410</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.usajobs.opm.gov/">http://www.usajobs.opm.gov/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.ccr.gov/">http://www.ccr.gov/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.montgomerycountymd.gov">http://www.montgomerycountymd.gov</a><!-- m -->
<!-- m --><a class="postlink" href="http://yp.shoutcast.com/directory/index.phtml">http://yp.shoutcast.com/directory/index.phtml</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.umd.edu">http://www.umd.edu</a><!-- m -->
What different ways can I make a rectangle with the text exactly in the center?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>CENTER TEXT</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
#blackbox{
position:absolute;
top:50%;
left:50%;
width:200px;
height:200px;
margin-top:-100px;
margin-left:-100px;
border:1px solid black;
}
p{
text-align:center;
font-size:20px;
line-height:100px;
margin:50px;
border: 1px solid red;
}
</style>
</head>
<body>
<div id="blackbox"><p>the text</p></div>
</body>
</html>
<!-- m --><a class="postlink" href="http://www.sony.com/vaiopeople">http://www.sony.com/vaiopeople</a><!-- m -->.
<!-- m --><a class="postlink" href="http://www.register.com/index.cgi?1|3784143410">http://www.register.com/index.cgi?1|3784143410</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.usajobs.opm.gov/">http://www.usajobs.opm.gov/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.ccr.gov/">http://www.ccr.gov/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.montgomerycountymd.gov">http://www.montgomerycountymd.gov</a><!-- m -->
<!-- m --><a class="postlink" href="http://yp.shoutcast.com/directory/index.phtml">http://yp.shoutcast.com/directory/index.phtml</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.umd.edu">http://www.umd.edu</a><!-- m -->
What different ways can I make a rectangle with the text exactly in the center?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>CENTER TEXT</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
#blackbox{
position:absolute;
top:50%;
left:50%;
width:200px;
height:200px;
margin-top:-100px;
margin-left:-100px;
border:1px solid black;
}
p{
text-align:center;
font-size:20px;
line-height:100px;
margin:50px;
border: 1px solid red;
}
</style>
</head>
<body>
<div id="blackbox"><p>the text</p></div>
</body>
</html>