dcsimg
www.webdeveloper.com
Results 1 to 10 of 10

Thread: div image backgrond

  1. #1
    Join Date
    Dec 2002
    Posts
    4

    div image backgrond

    i'm looking for a way to put a different background image in a DIV(a vertical left border and a top border), which should be repeated on the X or Y axis.
    Is this possible?

    Craban

  2. #2
    Join Date
    Nov 2002
    Posts
    984

    Re: div image backgrond

    Originally posted by craban
    i'm looking for a way to put a different background image in a DIV(a vertical left border and a top border), which should be repeated on the X or Y axis.
    Is this possible?
    Exactly what are you asking?
    If you can repeat 1 image in y and a different in x direction?

    Then no, not in the same div.
    But you could use 2 containers with one repeat y and the other repeat x.

    eg
    <div style="background:url(image.png) repeat-x;">
    <div style="background:url(image2.png) repeat-y;">
    </div></div>

  3. #3
    Join Date
    Dec 2002
    Posts
    4
    I've got a public CSS template wich uses DIV instead of frames.
    The template exists of a horizontal top, and three colums. With frames i can set a different background for the top and another for the left border.
    With DIV i can set the background color, but can i put a background imagein each DIV?
    http://users.pandora.be/strange-ente...border-all.JPG
    This is what it should look like. i sliced small portions of the image to tile the top and a slice for the left border wich can be repeated.
    Other images such as logo, the curve slice and text can be positioned.

    this should be a bit more clearer.

    regards
    craban
    Last edited by craban; 12-27-2002 at 01:15 PM.

  4. #4
    Join Date
    Nov 2002
    Posts
    984
    Originally posted by craban
    [B]I've got a public CSS template wich uses DIV instead of frames.
    The template exists of a horizontal top, and three colums. With frames i can set a different background for the top and another for the left border.
    With DIV i can set the background color, but can i do this with DIV?
    http://users.pandora.be/strange-ente...border-all.JPG
    This is what it should look like.
    Yes, you can do that with divs and CSS.
    You just put the respective slice as backgroundimage in the correct div.

  5. #5
    Join Date
    Dec 2002
    Location
    Switzerland
    Posts
    428
    Why don't you use tables?

  6. #6
    Join Date
    Dec 2002
    Posts
    4
    Yes, you can do that with divs and CSS.
    You just put the respective slice as backgroundimage in the correct div.
    is there anything special that should happen in the BODY tag?

    This is the tag that starts/heads the div of the left column.:
    <div id="leftcontent"> </div>

    could you format the line of code for me, i've been at it the whole afternoon, suffice it to say that i'm a newbie taking on more than i can chew.

    is it <img style... using "background" somewhere ??

    Thanks in advance
    regards
    Craban

  7. #7
    Join Date
    Nov 2002
    Posts
    984
    Well with something like this it's easiest to show a compleate solution as there are many ways you can achive the same effect. Partial solitions thus have a tendency to be a bit vague.

    Look here for an example of how to do it
    http://hem.bredband.net/b103277/layoutremake/
    Last edited by Stefan; 12-27-2002 at 11:08 PM.

  8. #8
    Join Date
    Dec 2002
    Posts
    4

    Thumbs up thanks

    Thank you Stefan, you've been a big help.

    Regards
    Craban

  9. #9
    Join Date
    Nov 2002
    Location
    England
    Posts
    275
    That page seems to be a bit messed up in my version of Mozilla (1.2.1) and the content isn't all visible, but I think it must be a bug, I can't see any coding errors This seems to fix it though: #content {position:absolute; top:90px; left: 84px;}

  10. #10
    Join Date
    Nov 2002
    Posts
    984
    Originally posted by Rick Bull
    That page seems to be a bit messed up in my version of Mozilla (1.2.1) and the content isn't all visible, but I think it must be a bug, I can't see any coding errors This seems to fix it though: #content {position:absolute; top:90px; left: 84px;}
    Hmm indeeed.
    It loosk as it should in
    Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.3a) Gecko/20021226 Phoenix/0.5

    But Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.1) Gecko/20020826
    is also broken.

    Wonder if the bug is also present in Moz 1.0x
    If it's only 1.1-1.2 it won't matter too much I guess, since people will quickly move on to 1.3 but if 1.0 is also affected by the bug then NS 7 is also likely to be :/

    In any case it only seems to be a bug regarding the top margin. This works too in Mozilla
    #content {margin:0 10px 0 84px; padding:90px 0 0;}

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles