Click to See Complete Forum and Search --> : [RESOLVED] Coloured block around text


Jonty
01-29-2009, 09:45 AM
I am formating a piece of text so that when certain conditions apply it is placed in a coloured block. Below is the html Im using.

But ..... at the moment the text is shown in the top left corner of the block and I want it to be shown in the middle of the block. Can anybody help please?

Thanks v much.

Jonty

.input1 {BORDER: none; FONT-WEIGHT: normal; FONT-SIZE: 11px; WIDTH: 100px; FONT-FAMILY: Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #A1C1E8; TEXT-DECORATION: none; height:24px;}

Fang
01-29-2009, 01:04 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/javascript">
</script>

<style type="text/css">
.input1 {
display:inline-block;text-align:center;vertical-align:middle;line-height:24px;
border: none;
font-weight: normal;
font-size: 11px;
width: 100px;
font-family: arial, helvetica, sans-serif;
background-color: #a1c1e8;
text-decoration: none;
height:24px;
}
</style>

</head>
<body>
<p>Duis autem vel eum iriure dolor in <span class="input1">hendrerit</span> in vulputate velit esse molestie consequat.</p>
</body>
</html>

Jonty
01-29-2009, 01:11 PM
Thats great fang - exactly what I needed.
Cheers.
Jonty