Jump to content

Keep text in the box


williamrouse

Recommended Posts

You don't need to use separate classes in span tags unless you want the two words to have different styles.

 

The reason the words are below the box is because of the default top margins which browsers use, they are different in each browser and because your font size is large, the margin is also larger than normal, so add margin-top: 5px; to the class:-

 

.branding{ margin-top: 5px;

font-family: Constantia,

"Lucida Bright", Lucidabright,

"Lucida Serif", Lucida,

"DejaVu Serif", "Bitstream Vera Serif",

"Liberation Serif", Georgia, serif;

font-style: italic;

font-size: 30pt;

color: red;

font-weight: bold;

text-decoration: none;

text-align: left;

}

 

If you want the words to center, change text-align: left; to text-align: center;

 

using your original markup:

William Bradley Rouse

 

For flush left bottom of the box, leave text-align: left; and adjust the top margin (margin-bottom is unreliable, using a bottom fix often doesn't work).

 

IE7, IE8 and Firefox and other browsers should be the same if you state the margin-top.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...