« Oracle: transpose data table (rows into columns) | Home | A vertical menu done in CSS »

CSS message quoting

<style type="text/css">

img
{
    border: 0;
    vertical-align: middle;
}

.quotetop
{
    border-right: 1px dotted #000;
    border-top: 1px dotted #000;
    background: #DDDDDD url('include/css_img_quote.gif') no-repeat right 50%;
    border-bottom: 0;
    border-left: 4px solid #FF9900;
    color: #000;
        font-weight: bold;
        font-size: 10px;
        margin: 8px auto 0 auto;
        padding: 3px;
}

.quotemain
{
    background: #FFFFFF;
    border: 1px dotted #000;
    border-left: 4px #FF9900 solid;
    border-top: 0;
    color: #000000;
    padding: 4px;
    margin: 0 auto 8px auto;
}

.quotetop1
{
    border-right: 1px dotted #000;
    border-top: 1px dotted #000;
    background: #DDDDDD url('include/css_img_quote.gif') no-repeat right 50%;
    border-bottom: 0;
    border-left: 4px #0000FF solid;
    color: #000;
    font-weight: bold;
    font-size: 10px;
    margin: 8px auto 0 auto;
    padding: 3px;
}

.quotemain1
{
    background: #FFFFFF;
    border: 1px dotted #000;
    border-left: 4px #0000FF solid;
    border-top: 0;
    color: #000000;
    padding: 4px;
    margin: 0 auto 8px auto;
}
</style>
</head>

<body>
         
     <div class="quotetop">QUOTE</div>
     <div class="quotemain">First quote</div>
     <p></p>
     <div class="quotetop1">QUOTE</div>
     <div class="quotemain1">More quotes</div>

</body>

</html>

Topics: css | Submitter: admin

One Response to “CSS message quoting”

  1. checkthis Says:
    March 1st, 2007 at 12:12 pm

    Theoretically, HTML tags Q and BLOCKQUOTE should realize exactly this behaviour. Never worked in any browser, anyway...

Comments

You must be logged in to post a comment.

Keep on coding