SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Threaded View

  1. #1
    SitePoint Member
    Join Date
    May 2007
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Align type in block elements to baseline

    I want to show two letters in different fonts side by side for a typography quiz I'm making. The two letters sit side-by-side using the markup sample below, but they aren't aligned on a baseline (the baseline of Verdana 'a' is lower than baseline of Garamond 'a'. Assuming that I keep the structure of two <div> elements, can I align them with css? I'm attaching a screen shot showing how I want it to look.

    Code:
    <html>
    <head>
    
    	<title>Type Test</title>
    	
    	<style type="text/css" media="screen">
    		body {
    			font-size:200px;
    		}
    		
    		#one {
    			float:left;
    			font-family:garamond;
    		}
    		
    		#two {
    			float:left;
    			font-family:verdana;
    		}
    	</style>
    </head>
    <body>
    	<div id="one">a</div>
    	<div id="two">a</div>
    </body>
    </html>
    Attached Images Attached Images


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •