Results 1 to 12 of 12

Thread: DIV Borders

  1. #1

    Thread Starter
    Evil Genius alex_read's Avatar
    Join Date
    May 2000
    Location
    Espoo, Finland
    Posts
    5,538

    DIV Borders

    Hi all!

    Can someone tell me how I can display a border on a DIV tag please?

    Code:
    <HTML>
    <HEAD>
    
    </HEAD>
    
    <BODY>
    
    	<DIV style="width:100px;height:100px" style="border:5">
    		<TABLE width="100px" height="100px" border="0">
    		<TR><TD>&nbsp;</TD></TR>
    		</TABLE>
    	</DIV>
    
    
    </BODY>
    </HTML>

    Please rate this post if it was useful for you!
    Please try to search before creating a new post,
    Please format code using [ code ][ /code ], and
    Post sample code, error details & problem details

  2. #2
    Frenzied Member Rick Bull's Avatar
    Join Date
    Apr 2002
    Location
    England
    Posts
    1,444
    It's the border:5 bit that's wrong - you're not specifying a unit (i.e. px). Also you can add a border style and colour like so:

    Code:
    <DIV style="width:100px;height:100px" style="border:5px solid black">

  3. #3

    Thread Starter
    Evil Genius alex_read's Avatar
    Join Date
    May 2000
    Location
    Espoo, Finland
    Posts
    5,538
    I did try with the units, it was the colour I missed, thanks for the help Rick!

    Please rate this post if it was useful for you!
    Please try to search before creating a new post,
    Please format code using [ code ][ /code ], and
    Post sample code, error details & problem details

  4. #4

    Thread Starter
    Evil Genius alex_read's Avatar
    Join Date
    May 2000
    Location
    Espoo, Finland
    Posts
    5,538
    Last one then, can you tell me how I can make the div be positioned in the center of the screen please?

    <DIV style="border:5px solid black; Align:Center">

    Please rate this post if it was useful for you!
    Please try to search before creating a new post,
    Please format code using [ code ][ /code ], and
    Post sample code, error details & problem details

  5. #5
    Conquistador
    Join Date
    Dec 1999
    Location
    Australia
    Posts
    4,527
    <DIV style="border:5px solid black;" align="center">

    i think

  6. #6

    Thread Starter
    Evil Genius alex_read's Avatar
    Join Date
    May 2000
    Location
    Espoo, Finland
    Posts
    5,538
    nice try! Thanks for the suggestion, tried that one though.
    That's the only 2 ways I've ever positioned an element.

    Please rate this post if it was useful for you!
    Please try to search before creating a new post,
    Please format code using [ code ][ /code ], and
    Post sample code, error details & problem details

  7. #7

    Thread Starter
    Evil Genius alex_read's Avatar
    Join Date
    May 2000
    Location
    Espoo, Finland
    Posts
    5,538
    It's okay thanks, apparently the align=center bit was taken out of the DIV tag spec in HTML version 4, I've got around it using the <CENTER></CENTER> tags around the DIV.

    Many thanks for all the help!

    Please rate this post if it was useful for you!
    Please try to search before creating a new post,
    Please format code using [ code ][ /code ], and
    Post sample code, error details & problem details

  8. #8
    Conquistador
    Join Date
    Dec 1999
    Location
    Australia
    Posts
    4,527


    that was going to be my next suggestion...

    What browser are you using as <div align="center"> works fine in ie6..?

  9. #9

    Thread Starter
    Evil Genius alex_read's Avatar
    Join Date
    May 2000
    Location
    Espoo, Finland
    Posts
    5,538
    errr, IE6 ?!?!?!?!

    Maybe I've done something to bugger up my broswer then, weird!

    Please rate this post if it was useful for you!
    Please try to search before creating a new post,
    Please format code using [ code ][ /code ], and
    Post sample code, error details & problem details

  10. #10
    Conquistador
    Join Date
    Dec 1999
    Location
    Australia
    Posts
    4,527
    hehehe

    yeah

    just checked it again to make sure i wasn't going insane

    Yes, it's fine, DIV tags work with the align property

  11. #11
    Fanatic Member punkpie_uk's Avatar
    Join Date
    Sep 2001
    Location
    UK
    Posts
    645
    hi, it's probably best if you use use css to position the element as align for the div tag is now deprecated.

    Try something like this...

    Code:
    <div style="width:100%; text-align:center;">
     <div style="width:100px;">
       Some text
     </div>
    </div>
    This is actually an unofficial way to do it. The official "correct" way is to set the margins to auto...

    Code:
    <div style="width:100px; margin-left:auto; margin-right:auto;">Some Text</div>
    ..but I believe this ins't supported by all browsers as yet.

    Also, did you notice in your original post you had 2 style attributes?
    SPREAD THE WORD!!! Are You Lee McCormick? Because I Am



    Lee M McCormick
    [email protected]

    Lee McCormick.com - Live
    Dynamically Webbed.com - In development but live

  12. #12
    Frenzied Member Rick Bull's Avatar
    Join Date
    Apr 2002
    Location
    England
    Posts
    1,444
    Lee's right, CSS is a better way to do it, but I think it only works in Mozilla like that. The text-align thing should work at all as it's only supposed to be inline content (hence text-align) and that should center the text inside the DIV, not the DIV. If IE did what it's supposed to we wouldn't be in this mess right now

    The other thing I do is just indent either side:

    Code:
    <div style="margin:0em 5em;">
      This  should be indented
      5ems from the sides.
    </div>

Posting Permissions

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



Click Here to Expand Forum to Full Width