Click here to get back home

box with text with grey background
 Home | NewsGroups | Search | About
Login Password
Register Now!
 comp.infosystems.www.authoring.html    Post an article   get this group's latest topics as an RSS feed add this group's latest topics to your My MSN content add this group's latest topics to your My Yahoo content
Subject Author Date
box with text with grey background mouse 07-09-2006
Posted by mouse on July 9, 2006, 6:49 pm
Please log in for more thread options

I require some HTML which will draw a rectangular box with some small
text in it (e.g. an email message which is being quoted apart from the
rest of the text). The box should have a thin black boundary, and a
light grey background to make the text distinctive from what it
outside the box.

I would guess that a <TABLE> would have to be used with one entry and
some form of table entry background colour selection would be
necessary. Can people offer wise words on the tags and design choices
for such an element? Or are there examples on the web which come to
mind, so I can steal their code? Thank you.

Posted by Chris F.A. Johnson on July 9, 2006, 7:10 pm
Please log in for more thread options

On 2006-07-09, mouse@house.spam wrote:
> I require some HTML which will draw a rectangular box with some small
> text in it (e.g. an email message which is being quoted apart from the
> rest of the text). The box should have a thin black boundary, and a
> light grey background to make the text distinctive from what it
> outside the box.

<div style="border: 1pt solid black;
padding: 1em;
background-color: #dddddd;
color: black;
width: 80%;
margin: auto;">
Text here.
</div>

> I would guess that a <TABLE> would have to be used with one entry and
> some form of table entry background colour selection would be
> necessary. Can people offer wise words on the tags and design choices
> for such an element? Or are there examples on the web which come to
> mind, so I can steal their code? Thank you.


--
Chris F.A. Johnson, author <http://cfaj.freeshell.org>
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
===== My code in this post, if any, assumes the POSIX locale
===== and is released under the GNU General Public Licence

Posted by Beauregard T. Shagnasty on July 9, 2006, 7:19 pm
Please log in for more thread options


mouse@house.spam wrote:

> I require some HTML which will draw a rectangular box with some small
> text in it (e.g. an email message which is being quoted apart from
> the rest of the text). The box should have a thin black boundary, and
> a light grey background to make the text distinctive from what it
> outside the box.
>
> I would guess that a <TABLE> would have to be used with one entry and
> some form of table entry background colour selection would be
> necessary. Can people offer wise words on the tags and design choices
> for such an element? Or are there examples on the web which come to
> mind, so I can steal their code? Thank you.

Sounds like the perfect use of a <blockquote>. I've used it on a number
of pages, including this one:
http://k75s.home.att.net/tips.html

Styling in the CSS. Pick your own colors:
http://k75s.home.att.net/style/shag.css

--
-bts
-Warning: I brake for lawn deer

Posted by mouse on July 10, 2006, 1:08 am
Please log in for more thread options


On Sun, 09 Jul 2006 23:19:36 GMT, "Beauregard T. Shagnasty"

>mouse@house.spam wrote:
>
>> I require some HTML which will draw a rectangular box with some small
>> text in it (e.g. an email message which is being quoted apart from
>> the rest of the text). The box should have a thin black boundary, and
>> a light grey background to make the text distinctive from what it
>> outside the box.
>>
>> I would guess that a <TABLE> would have to be used with one entry and
>> some form of table entry background colour selection would be
>> necessary. Can people offer wise words on the tags and design choices
>> for such an element? Or are there examples on the web which come to
>> mind, so I can steal their code? Thank you.
>
>Sounds like the perfect use of a <blockquote>. I've used it on a number
>of pages, including this one:
>http://k75s.home.att.net/tips.html
>
>Styling in the CSS. Pick your own colors:
>http://k75s.home.att.net/style/shag.css

It's strange because while blockquote works on your webpage, when I
try to code an elementary example it doesn't work for me, it indents
but there is no border. Does the;

<style type="text/css">
cite {margin: 0 3em; padding-top: 0; }
h2 { margin-top: 1.5em; }
p, ol, ul, blockquote { max-width: 40em; font-family: "Trebuchet MS",
sans-serif; }
</style>

at the beginning of the file have anything to do with your blockquotes
having borders? As you can see I'm a bit of an html newbie.

Chris Johnson's DIV works great.

Posted by Beauregard T. Shagnasty on July 10, 2006, 8:28 am
Please log in for more thread options


mouse@house.spam wrote:

> On Sun, 09 Jul 2006 23:19:36 GMT, "Beauregard T. Shagnasty"
>
>> Sounds like the perfect use of a <blockquote>. I've used it on a
>> number of pages, including this one:
>> http://k75s.home.att.net/tips.html
>>
>> Styling in the CSS. Pick your own colors:
>> http://k75s.home.att.net/style/shag.css
>
> It's strange because while blockquote works on your webpage, when I
> try to code an elementary example it doesn't work for me, it indents
> but there is no border. Does the;
>
> <style type="text/css">
> cite {margin: 0 3em; padding-top: 0; }
> h2 { margin-top: 1.5em; }
> p, ol, ul, blockquote { max-width: 40em; font-family: "Trebuchet MS",
> sans-serif; }
> </style>
>
> at the beginning of the file have anything to do with your blockquotes
> having borders? As you can see I'm a bit of an html newbie.

The border comes from the CSS file:

blockquote {
        background: #f9f9f9 none;
        border: solid #696 1px;
        clear: both;
        color: #000;
        margin: 0 0 0 2em;
        padding: 0.5em;
}
blockquote p {margin: 0; }

--
-bts
-Warning: I brake for lawn deer

Similar ThreadsPosted
Composition of text and background colors. March 28, 2005, 9:58 am
css text wrap and background problem July 17, 2007, 7:48 am
White text on black background...HTML May 14, 2008, 5:21 pm
Google tool bar changes text input background color November 14, 2007, 2:50 pm
making a site grey out October 1, 2007, 12:08 pm
grey-out/disabled item in listbox March 10, 2006, 11:22 pm
Background images January 25, 2005, 5:19 pm
with background image - what's the right way? March 4, 2005, 5:51 pm
Cannot set background color (XML+CSS) July 6, 2005, 12:16 am
How to make background img fit June 28, 2006, 10:01 am

Our other projects:

Art Dolls, Fairies and Mermaids - Sunnyfaces.net

Roy's Linux, Programming and Search Engines messages

1-Script XML SitemapXML Sitemap