My struggle is with changing the font size and alignment on my website. Despite numerous attempts, I can't seem to get it right. The text is currently left-aligned when I want it centered, and I also need it to be larger in size. Take a look at my code below!
HTML
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
...
<div class="qt">
<?
$filename = "quotes.txt";
function RandomLine($filename) {
$lines = file($filename);
echo $lines[array_rand($lines)];
}
echo RandomLine($filename);
?>
</div>
<div class="home">
<a href="http://www.jonsnow.net/index.php" id="h1"></a>
<a href="http://www.jonsnow.net/gallery/" id="h2"></a>
</div>
CSS
div.home a {
float: left;
display: inline;
}
div.home img {
float: top;
display: inline;
}
div.home {
position: absolute;
top: 20%;
bottom: 0;
left: 0;
right: 0;
width: 1000px;
margin: auto;
}
div.qt {
text-align: "center";
font-family: "Vivaldi";
font-size: "44 px";
color: "#000000";
position: absolute;
top: -60%;
bottom: 0;
left: 0;
right: 0;
width: 1000px;
margin: auto;
height: 62px;
display: inline;
}
div.home #h1 {
width: 500px;
height: 350px;
display: inline;
background-image: url('header1.jpg');
}
div.home #h1:hover {
background-image: url('header1hover.jpg');
}
div.home #h2 {
width: 500px;
height: 350px;
display: inline;
background-image: url('header2.jpg');
}
div.home #h2:hover {
background-image: url('header2hover.jpg');
}