Belter Belter - 3 months ago 8
CSS Question

How to center multiple line text in html using css, just like <center>?

I have this html content:

<div class="test">
<a href=/cgi-bin/source/sourceSearch><img border=0 src=http://source-search.princeton.edu/images/SOURCE/sourcehdrBlue.gif></a>
<h2 style='margin-bottom:0px'>BATCH</h2>
<table border="0" cellpadding="0" width="600">
<tr>
<td><h3>SOURCE is now hosted by Princeton University. The supporting database was last updated on June 10, 2015. </h3> <p>This page is the batch extract interface for SOURCE. You can input a list of GenBank Accessions, dbEST cloneIDs, UniGene ClusterIDs, UniGene gene names, UniGene gene symbols microarray Probes from various platforms (Affymetrix, Agilent, Heebo/meebo, Illumina) or coordinates (e.g.: chr1 14565 15000 - chromosome, from, to - one set per line) and retrieve data from the checklist below. You will be given a link to the output file when processing is complete.</p> <p>You may enter the identifiers as a file or as a list in the text area below. If you are entering an input file, it must be a text file consisting of a single column containing one of the accepted types of identifiers.</p> <p>Please see the <a href="http://source-search.princeton.edu/help/SOURCE/resultsBatchHelp.html">help</a> section for further information. Or go to <a href="http://source-search.princeton.edu/cgi-bin/source/sourceSearch">Single Entry SOURCE Search.</a> </p></td>
</tr>
</table>
</div>


Just adding
<center>... </center>
surround all these code, that is what I want.
enter image description here
Since
<center>
tag was deprecated in HTML, I want to use css instead of
<center>
. My css code likes this:

div.test {
margin-left: auto;
margin-right: auto;
text-align: center;


}

I got this:
enter image description here

I tried everything I can find, but all of them not work for me. I use windows 7 and chrome, I have seen Why is the tag deprecated in HTML? and Simple center a object with css and no hacks.

Answer

there is a reason why you using <table>?

change your css:

    div.test {
text-align: center;
}

div table{
  margin: 0 auto;
}

fiddle

click here for your code

this will answer you why <center> is deprecated answer here

Comments