mcanzani Posted May 28, 2014 Share Posted May 28, 2014 My client has changed her ™s to ®s, but wants the ® smaller than the font. I've tried it half a dozen ways, most of which work in Firefox and Chrome but do not work in Safari. Right now it reads: <span class="introheader®"><sup>®</sup></span> and .introheader® { font-family: Verdana; font-size: 5px; line-height: 1.4em; font-weight: bold; color: #552C16; text-align: left; vertical-align: text-top; } I've lost track of how many variations I have tried. Looks fine in DreamWeaver Live View, Firefox and Chrome, just not in Safari. Anyone else come across this? Link to comment Share on other sites More sharing options...
newseed Posted May 31, 2014 Share Posted May 31, 2014 Try changing the font size to 100% and then style the <sup> to have a width and height (5px each). Link to comment Share on other sites More sharing options...
kelly2marie Posted May 31, 2014 Share Posted May 31, 2014 (edited) I would remove the symbol from the selector and class attribute so that your selector is just .introheader. Also, remove <sup></sup> that you have wrapped around the symbol in the html. Assuming you are using the Text in a Heading tag, here's the HTML: <h1>My Product<span class="introheader">®</span></h1> The CSS: h1 { font-family: Verdana, Helvetica, sans-serif; font-size: 28px; etc... } .introheader { font-size: 13px; vertical-align: 12px;} I created a fiddle at http://jsfiddle.net/kelly2marie/47XtJ/ The vertical-align Property can be given any one of the following values: super sub baseline bottom middle etc etc... Or use a value. That's what I did because I didn't like the look super had. It needed to go up higher just a bit so I went with 12px for the vertical alignment. Give this a whirl. Edited May 31, 2014 by kelly2marie Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now