1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Splash Page Image Background - How do I center fluidly?

Discussion in 'HTML & Website Design' started by Altug, Oct 17, 2012.

  1. #1
    Hey DP'ers,

    hope everybody is well today.

    I may not have worded this right in the title but hopefully I can explain it better here with a demonstration. I'm creating a simple splash page for my friend's business out of an image that he has sent me.

    Here it is : http://al2web.com

    I have managed to center it and it looks good on the two screens I've viewed it on but he is viewing from a humungous Mac screen and said he can see the white borders where the image ends.

    Is there a way that I can have the background a solid colour and then have the image centered on top of the background colour?

    Also is there a way for the image to resize to fill up a certain portion of the screen? What I mean by this is that on his mac, he asked me to increase the size of the image because the image looked really small to him..but on the two monitors I viewed on, it appeared perfectly. In fact any bigger would have been too much. Is there a way to, for example, make the image fill up 75% of whatever monitor it is opened on?

    Thanks very much in advance for any answers or help. Really appreciate it.
     
    Altug, Oct 17, 2012 IP
  2. xXxpert

    xXxpert Well-Known Member

    Messages:
    604
    Likes Received:
    34
    Best Answers:
    9
    Trophy Points:
    165
    Digital Goods:
    7
    #2
    use this css property.

    body
    {
     background:url(images/bg.jpg) center top #000;
    }
    Code (markup):
     
    xXxpert, Oct 17, 2012 IP
  3. Altug

    Altug Active Member

    Messages:
    188
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    53
    #3
    Thanks for your help xxxpert!

    I put that code in but it seems to push the image down outside of the center. Check it out http://al2web.com

    Also does anyone know if it is possible to expand or reduce the picture size depending on the size of the monitor viewing? So that it fills about 75% of the monitor? Any css code for this? Thanks :)
     
    Altug, Oct 18, 2012 IP
  4. technolabsoftware

    technolabsoftware Peon

    Messages:
    53
    Likes Received:
    1
    Best Answers:
    2
    Trophy Points:
    0
    #4
    Hi, I have checked it in MAC its working fine, pls can you take screen shot from your friend.
     
    technolabsoftware, Oct 20, 2012 IP