3 Replies Latest reply on Feb 8, 2010 6:34 PM by nemci7v

    How can I do this?

    nemci7v Level 1

      The things that I assume to be easy are always the tricky ones lol..

       

      I'm trying to get something like this. I hope someone can help me. The red lines just represent a box.

       

      textsample.jpg

      The CSS I made is

       

      .box {

            width: 250px;

            text-align: justify;

            backgruond: transparent url (images/line) repeat-x scroll ...

      }

       

      .title {

            font-size:20px;

            color:blue;

            text-align:center;

            padding: 10px;

            background: #ffffff;

      }

       

      So i'm trying create a gap in the line where the blue title is. I thought I would achieve this by simply giving the title a white background that will overlay on the line but unlike the image above I get this..

       

      sampletext2.jpg

      The white background extends 100%. I thought of giving each title a width but the text length may change and I'll have to edit the css every time that happens. When I don't center the font and float it left for example, the white background stays contained within the text length. Is there a way to do that with the text centered?