문제

The URL is http://crispylogs.com/writing-high-quality-posts-to-increase-traffic-top-20-tips/

I am trying to add an effect, like a magazine's "drop-cap," but it's not working for me, and I don't know why.

The following is the CSS code I have used:

.single .entry p:first-child:first-letter {  
    float: left;  
    color: #903;  
    font-size: 47px;  
    line-height: 40px;  
    padding-top: 0px;  
    padding-right: 8px;  
    padding-left: 3px;  
    font-family: Georgia;  
}
도움이 되었습니까?

해결책

your p tag is not first child. That is the problem

try first-of-type

다른 팁

that is not CSS

remove the <pre> </pre>

that should help

I was able to use your styles to create the effect you want: http://jsfiddle.net/uEkqU/

Perhaps you're running into a specificity issue? Try the following:

.post .entry p:first-child:first-letter {  
    float: left;  
    color: #903;  
    font-size: 47px;  
    line-height: 40px;  
    padding-top: 0px;  
    padding-right: 8px;  
    padding-left: 3px;  
    font-family: Georgia;  
}
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top