Results 1 to 5 of 5

Thread: Page Borders, At Least I Think...

  1. #1
    Join Date
    Dec 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Page Borders, At Least I Think...

    Hi,
    First, I wanted to thank everyone for checking out this message. If I have placed this in the wrong forum, or if it is inappropriate for this forum please let me know.

    After a LONG hiatus from website building I have gotten back into it. The short reason list being that I need to have creative control, I'm a constant tweaker, and $$$.

    I am going after a distinctive look for my site. Mainly, an entire webpage contained in a (colored) border. Example sites I have looked at being:
    www.lifewithwealth.com
    www.tizag.com/beginnerT/

    In these, all the content is contained in a box centered in the middle of the page. How to accomplish this I have no idea. Are there scripts (javascript?) to do this. Is it CSS (of which I have never used). Any help on where to look would be GREATLY appreciated. Good tutorials, links to scripts, etc.

    Thanks In Advance
    Captnwolfy

  2. #2
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,494
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    The "border" is basically just a background image (in this case a single color), with the other text area layered ontop.

    there are many ways to accomplish this, the easiest is thus:

    make your back ground color choice then make a table for the center content, something like"

    <body>
    <table width="630" border="0" align="center" cellpadding="10" bordercolor="#CCCCCC" bgcolor="#FFFFFF">
    <tr>
    <td width="339" height="290" valign="top"><p align="center">TITLE OF PAGE HERE </p>


    and on and on until your "table" is complete. then you will have a nice border of color around a center aligned table of content.
    {CWoT - Riddle } {Freelance Copywriter} {Learn to Write}
    Follow Me on Twitter: @InkingHubris
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  3. #3
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Captnwolfy
    I am going after a distinctive look for my site. Mainly, an entire webpage contained in a (colored) border.
    Code:
    #wrapper {
      border: solid 2px color
      margin: 0 auto;
    }
    HTML Code:
    <body>
      <div id="wrapper">
        <!-- ... -->
      </div>
    </body>

    [...] make a table for the center content [...]
    Umm, why?

    Mike

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,496
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by Mike
    Code:
    #wrapper {
      border: solid 2px color
      margin: 0 auto;
    }
    Got to put that semicolon in there:

    Code:
    #wrapper {
      border: solid 2px color;
      margin: 0 auto;
    }
    Also, judiciously declaring a width as well as some padding for #wrapper would make a bit more sense in actual practice, as opposed to this purely theoretical example.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by jscheuer1
    Got to put that semicolon in there:
    Yes, I think adding the italics delimiters made me forget that.

    Also, judiciously declaring a width [...]
    Yes, a width or max-width declaration would be necessary otherwise the div element would expand to fill the width of the body element (as block-level elements do). As this is bound to lead to a fixed-width design, I was expecting the OP to do that, anyway.

    Mike

Bookmarks

Posting Permissions

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