S
Simon Laub
I have a number (many) of old web pages with list items that look horrible
in Google Chrome.
In html it looks something like this:
<html>
<head>
<style type="text/css">
h1 {text-align:center}
h2 {text-align:left}
h3 {text-align:right}
p {text-align:center}
li {text-align:center}
</style>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<p>sfjsdfhghdf
<ul>
<li>sdf</li>
<li>kdfgjd</li>
</ul>
</p>
</body>
</html>
Testing this on w3 schools
http://www.w3schools.com/Css/tryit.asp?filename=trycss_text-align
the list items are centered as expected.
The pages are 10+ year olds and still come out
correctly in IE and Mozilla. But Google Chrome
insists on putting the lists left centered and the text
centered. Basicly destroying the layout of the pages.
tried a stylesheet solution
#center {margin-right:auto;margin-left:auto;width:740px;}
and double aligns like -
<div align="center">
<div id="center">
and then it works. While something like
<div class="center">
around the whole thing doesnt work in Chrome -
it works in all other browsers.
Whats going on you wonder. Even
if the html wasnt correct I would argue
that stylesheets people have been using for years
in all other browsers should be supported ...
But here the codes even seems to be correct and verified.
While letting of steam you kind of wonder with this alignment thing,
It started off like
<center>
. . .
. . .
</center>
which was then replaced with
<div align="center">
...
...
</div>
and now most people do something like:
<style>
center{margin-right:auto;margin-left:auto;width:740px;}
</style>
<div class="center">
...
...
</div>
Progress you wonder?
But worst of all of course, when it if still doesnt work.
Any suggestions on what to do to make it
work in Chrome also?
-Simon
in Google Chrome.
In html it looks something like this:
<html>
<head>
<style type="text/css">
h1 {text-align:center}
h2 {text-align:left}
h3 {text-align:right}
p {text-align:center}
li {text-align:center}
</style>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<p>sfjsdfhghdf
<ul>
<li>sdf</li>
<li>kdfgjd</li>
</ul>
</p>
</body>
</html>
Testing this on w3 schools
http://www.w3schools.com/Css/tryit.asp?filename=trycss_text-align
the list items are centered as expected.
The pages are 10+ year olds and still come out
correctly in IE and Mozilla. But Google Chrome
insists on putting the lists left centered and the text
centered. Basicly destroying the layout of the pages.
tried a stylesheet solution
#center {margin-right:auto;margin-left:auto;width:740px;}
and double aligns like -
<div align="center">
<div id="center">
and then it works. While something like
<div class="center">
around the whole thing doesnt work in Chrome -
it works in all other browsers.
Whats going on you wonder. Even
if the html wasnt correct I would argue
that stylesheets people have been using for years
in all other browsers should be supported ...
But here the codes even seems to be correct and verified.
While letting of steam you kind of wonder with this alignment thing,
It started off like
<center>
. . .
. . .
</center>
which was then replaced with
<div align="center">
...
...
</div>
and now most people do something like:
<style>
center{margin-right:auto;margin-left:auto;width:740px;}
</style>
<div class="center">
...
...
</div>
Progress you wonder?
But worst of all of course, when it if still doesnt work.
Any suggestions on what to do to make it
work in Chrome also?
-Simon