CSS - Css P:first-letter
Why can't I get this to work on the first letter -
#maincontent { float: right; top: 100px; width:638px; margin-left:132px; height:500px; clear:right; position: absolute; background-repeat: no-repeat; border: 0px solid purple; text-align:left; padding-top:0px; } #maincontent H1{ display:block; width:auto; border: 0px solid purple; text-align:center; margin-top:20px; margin-bottom:40px; color:#000066; font-size:16px; } #maincontent P{ width:80%; margin-left:10%; margin-right:10%; display:block; background-repeat: no-repeat; border: 0px solid purple; text-align:justify; padding-top:0px; color:#08207B; } #maincontent P img{ border: 2px solid #08207B; float:left; margin-right:5px; margin-bottom:0px; } #maincontent P:First-Letter{ color:red; font-size:24px; } Everything else works fine... Similar TutorialsHi everyone. I would like to change the first letter of an h2 tag thats NOT in a span in the following chunk of code Code: <h2> <span class="subtleHeader">Saskatoon, Regina and Edmonton's</span><br> WEB DESIGN EXPERTS </h2> So in this example I want to change the W. yes I can change the dom, but I'm very very lazy and have this DOM structure in many places and was wondering if there was a css way to do it. Thanks I'm attempting to display a first-letter style to my h1 tags, which has until now been a simple task. Everything was working fine until I made my h1 style display inline to remove the autyomatic line-break. Now my first letter style doesn't work. This happens on both Firefox and IE. code is thus: h1 { font-size:13pt; color:#2E3192; font-family:verdana, arial, sans-serif; font-weight:bold; display:inline; } h1:first-letter { font-style:italic; color:#CC6600; } Can anyone shed any light on this problem? I read somewhere that we can format the first letter of each paragraph separately from the rest of it by CSS. Is possible and how? I look after a website whose stylesheet includes the instruction p, ul, li { font-size: 12px; letter-spacing: 0.15em; padding-bottom: 1em; } This is interpreted as intended by IE and FF. However, Google Chrome appears to ignore the instruction. I'm not allowed to post a URL here, but if you search Google for "Stile Antico", you'll find the site as the first result, and then click on "The Group" for a page with plenty of body text. I've experimented for different values of the letter-spacing property, with mixed results; at 0.2em, Chrome gets it right (but this is aesthetically not good for me). I suspect there may be an issue with rounding/decimal places - but even so, that wouldn't explain why Chrome ignores 0.15em, rather than rounding it to the nearest usable value. Can anyone shed any light? I can't find a good workaround; I want to keep things expressed in relative units if possible. Thanks in advance for any help Andrew Do you guys know if there is any way to change the style of only the first letter in a paragraph? For example: "The duck is dead and it can't come back to life." The letter T would get an effect such as switch of baseline, color, bgcolor and indentation. How is this possible without having to add a class to that particular first letter all the time. I am using this in a weblog system so it would need to be added in a template. Any help? Thanks! I want to do something like: Submit but i dont know how to do it? i tried doing input value ="<span style="AK">S</span>ubmit" /> but it doesnt work.... Hi, Tried using Pseudo Elements to set style property for first character (first-letter) and first line (first-line) inside an element. Every thing works fine when we set such styles on div or table elements, but failed on anchor tags Working on Code: <style> div:first-letter{font-weight: bold;} </style> <div> Pseudo Div<br> Line Two<br> Line Three<br> </div> Failed On Code: <style> a:first-letter{font-weight: bold;} </style> <a href=""> Pseudo Div<br> Line Two<br> Line Three<br> </a> Can anyone give me the solution for this. Thanks in advance! Due to letter-spacing double break won't work in IE. And triple break works as it is double break. How to solve this problem? |