Click to See Complete Forum and Search --> : How to insert text box in middle of page


Beunique
03-20-2005, 09:43 PM
I want to put some extra text on my web page but I want it to go into a box - something like a form - but just with my text in it. I don't mean the form used to get feedback from others. This would be like a "advise" or "ideas" to the reader. How do I go about with the HTML on this?

phpnovice
03-20-2005, 09:52 PM
If you don't need input from the visitor, then I would not use a FORM text box. Instead, you can use a DIV box and, via styles, format it to look like a text box -- if that is what you desire.

Beunique
03-20-2005, 09:56 PM
How do I go about using the DIV box and formating it?

phpnovice
03-20-2005, 10:08 PM
That depends upon what you want exactly.

Beunique
03-20-2005, 10:16 PM
After writing some text on my page I want a box or frame that will stand out with my "advise" or " ideas for gifts". I know I can link to another page for this but I want just a small box that will stand out in middle of the page that I am writing. Am I making sense on this?
Thanks for responding!

ray326
03-20-2005, 10:43 PM
Is this (http://www.alistapart.com/articles/crosscolumn/) the kind of thing you're talking about or is it something simpler?

Beunique
03-20-2005, 10:55 PM
In the second paragraph of Zeldaman text, the words" and #7 in Customers Picks" -- there is a box with the words --Just wanted to let you know that --

Yes, that is what I am talking about.
Thanks for responding.

phpnovice
03-20-2005, 11:06 PM
This is the HTML used for that:

<div class="toutpanel">
<blockquote><p>&amp;#8220;Just wanted to let you know that my first recode after reading your book reduced page weight by 85%. I had put together a listing page (a big table) in a PHP/SQL database the old way, and the character count for the resulting page code was 211,000. After redoing it as structural XHTML, with CSS layout, and to standard, I ended up with 30,000 characters, and a better design.&amp;#8221;&amp;#8212;M. Beckley Roberts</p></blockquote>
</div>

Getting the CSS is another matter. :)

Beunique
03-20-2005, 11:39 PM
Thank You phpnovice,

For my own curiosity and because I am learning HTML what does the numbers #8220 and "toutpanel" mean? Will it come out with a small frame around it like in Zeldman? Can you change the color of the box?
Thanks,

phpnovice
03-21-2005, 08:07 AM
&amp;#8220 and &amp;#8221 are the Unicode values for left and right curly double-quotes. &amp;#8212 is the Unicode value for an em dash. If you view the original Zeldman text you'll see this.

"toutpanel" is an arbitrary class name, i.e., chosen by the HTML designer, which refers to a set of CSS style specifications in the HEAD section of the HTML document in question. These are what determine the format of the DIV.

I found them this time:

div.toutpanel {
background: #eec;
border: 1px dotted #ccb;
margin: 0 0 10px 0;
padding: 0 10px;
}

div.toutpanel p {
margin-top: 5px;
background: transparent;
color: #663;
}