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 9 of 9
  1. #1
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts

    borders for an image

    I have a page that basically shows a bunch of images.
    Is there anyway -(I guess with css) that I can put a background or a border so that it appears that the images are in a nice frame?
    (the images are all the same height but not width)

    Does anyone have an example of where this is done?

    Thanks..

  • #2
    Regular Coder
    Join Date
    Sep 2004
    Posts
    347
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Could you give us a link so we understand better what you are trying to do?

    Thanks!

  • #3
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    hmm. I don't have it up yet...
    It's just a pictures each 100 pixels wide... 4 on a row.
    I just want to put a nice border around them so that it looks good.
    (I don't have the border yet)

    any suggestions?

  • #4
    Regular Coder
    Join Date
    May 2005
    Location
    lincolnshire
    Posts
    155
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Use CSS to add affects

    You could add a nice border using CSS, this is my preffered method for img decoration, you could have dotted solid , dif thickness, doubled, dif colors even curved or drop shadow with the right style;

    try this for starters;

    img
    {
    border:1px dotted black;
    margin: 2px;
    padding: 2px;
    }

    I think this is what you meant!
    littletoaster - web design dwsystems -pc repair

    "If the diver thought of the shark, he would never lay hands on the pearl"

  • #5
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    Hi Anything to do to make it look even nicer then just a dotted border?

    Anyway to make a curved border with shading??

  • #6
    Regular Coder
    Join Date
    May 2005
    Location
    lincolnshire
    Posts
    155
    Thanks
    0
    Thanked 0 Times in 0 Posts

    one way i know off for curv and drp shadow

    it would have to be graphics!

    as for css attributes the borders could be;

    none
    hidden
    dotted
    dashed
    solid
    double
    groove
    ridge
    inset
    outset

    thick/ thin/ medium or any width you like;

    the different borders could be different styles / colors to get some nice affects, dont forget an plainish img with loads of padding looks really good
    littletoaster - web design dwsystems -pc repair

    "If the diver thought of the shark, he would never lay hands on the pearl"

  • #7
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    I tried doing an image as a background but it looked messed up.

    Do you know of any pages that has an example of this?

  • #8
    Regular Coder
    Join Date
    May 2005
    Location
    lincolnshire
    Posts
    155
    Thanks
    0
    Thanked 0 Times in 0 Posts

    I just popped this web page up for u

    click here

    left pic = css border
    mid = drop shadow
    right = graphic behind pic
    a simple frame around the lot!(this can be decorated as above, ie dotted/outset)

    hope this helps you, got view source to view code if u need too.



    Last edited by little_toaster; 06-02-2005 at 08:18 PM.
    littletoaster - web design dwsystems -pc repair

    "If the diver thought of the shark, he would never lay hands on the pearl"

  • #9
    Senior Coder
    Join Date
    May 2004
    Posts
    1,457
    Thanks
    15
    Thanked 0 Times in 0 Posts
    thanks -- i guess I was looking for somethign fancier.

    I'll have to play around in photoshop.


  •  

    Posting Permissions

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