Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2

Thread: Text in border

  1. #1
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Text in border

    Is there any way i can force my text to be in the border i am putting around a div area?

    This is what i want it to look like, pardon my crappy msp drawing :P


  • #2
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Like this perhaps?
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    	<meta http-equiv="content-type" content="text/html; charset=utf-8">
    	<title>Untitled</title>
    	<style type="text/css">
    
    		#content	{
    			padding: 1em;
    			position: relative;
    			border: solid 1px #000;
    			}
    		
    		h2	{
    			position: absolute;
    			top: -1.9em;
    			left: 50%;
    			margin-left: -2em;
    			padding: .5em;
    			background: #fff;
    			}
    		
    	</style>
    	</head>
    <body>
    	<h1>text effect</h1>
    	<div id="content">
    		<h2>content</h2>
    		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in </p>
    		<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in </p>
    	</div>
    </body>
    </html>
    <legend> and <fieldset> also work together to produce the same effect, but I think they are reserved in the "semantic structure" for forms (could be wrong)...
    Last edited by rmedek; 02-12-2005 at 03:23 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •