CSS Styling af comments.php (WordPress)
Hej,Jeg skal bruge noget hjælp til at få stylet mine "kommentarbokse" pænt i WordPress. Resultatet jeg ønsker at komme frem til skal ligne det øverste eksempel på denne side: http://www.willmayo.com/2007/02/10/css-speech-bubbles/
Hvordan sætter jeg derfor min kode:
<?php if($comments) : ?>
<ol>
<?php foreach($comments as $comment) : ?>
<li id="comment-<?php comment_ID(); ?>">
<?php if ($comment->comment_approved == '0') : ?>
<p>Your comment is awaiting approval</p>
<?php endif; ?>
<?php comment_text(); ?>
<p class="meta"><?php comment_type(); ?> by <?php comment_author_link(); ?> on <?php comment_date(); ?> at <?php comment_time(); ?></p>
</li>
<?php endforeach; ?>
</ol>
<?php else : ?>
<p>No comments yet</p>
<?php endif; ?>
... op i nedenstående div'er:
<div class="bubble">
<blockquote>
<p>Works great for blog comments!</p>
</blockquote>
<cite><strong>John Smith</strong> on 1st January 2007 at 3:55pm</cite>
</div>
... CSS koderne ser således ud:
div.bubble {
width: auto;
font-size: 0.75em;
margin-bottom: 24px;
}
div.bubble blockquote {
margin: 0px;
padding: 0px;
border: 1px solid #c9c2c1;
background-color: #fff;
}
div.bubble blockquote p {
margin: 10px;
padding: 0px;
}
div.bubble cite {
position: relative;
margin: 0px;
padding: 7px 0px 0px 15px;
top: 6px;
background: transparent url(tip.gif) no-repeat 20px 0;
font-style: normal;
}
