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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 17
  1. #1
    New Coder
    Join Date
    Jan 2010
    Posts
    68
    Thanks
    3
    Thanked 5 Times in 4 Posts

    Background-repeat y + margin-top?

    I have a html table with 3 columns. My right column has a background image that repeats Y axis.

    I want the background image to start showing at 30px down from the top (to leave room for my facebook 'like' button - otherwise it gets drowned out).

    Is this possible? I've tried padding-top and margin-top and that didn't do a thing.

    Code:
    #right {
    width:133px;
    padding-top:15px;
    background-color:#FFFFFF;
    background-image: url(images/panel.jpg);
    background-repeat: repeat-y;
    text-align:center;
    }

  • #2
    Regular Coder
    Join Date
    Oct 2010
    Location
    Florence, MS
    Posts
    486
    Thanks
    10
    Thanked 33 Times in 32 Posts
    Use the background-position: xpos ypos using pixels or you can use percent.
    Notice: If you post a problem and it gets fixed, please remember to go back and place it as solved. ;)
    I always recommend the HEAD First series of books for learning a new coding language. ^_^

  • #3
    New Coder
    Join Date
    Jan 2010
    Posts
    68
    Thanks
    3
    Thanked 5 Times in 4 Posts
    I just tried :

    background-position: 0px 30px;

    All that did was move the top part down, but the bottom part starting showing up top instead (to fill in the missing space)

  • #4
    Regular Coder
    Join Date
    Oct 2010
    Location
    Florence, MS
    Posts
    486
    Thanks
    10
    Thanked 33 Times in 32 Posts
    Mind showing the entire html and css, so that I can use my editor to look at it?


    EDIT:

    Or you can try setting the top margin to 30px then set the like button to the position to -30px.
    Last edited by Chris Hick; 11-09-2010 at 07:36 AM.
    Notice: If you post a problem and it gets fixed, please remember to go back and place it as solved. ;)
    I always recommend the HEAD First series of books for learning a new coding language. ^_^

  • #5
    New Coder
    Join Date
    Jan 2010
    Posts
    68
    Thanks
    3
    Thanked 5 Times in 4 Posts
    http://www.giftauto.com/style2.css
    http://www.giftauto.com/test.htm
    ^ Is what I'm doing

    http://www.giftauto.com (original site)

    This is a project that I'm helping the owner clean up - if you load the firebug addon in firefox, you will see the divs are crazy out of whack.

    I've converted it in to 3 tables and cleaned up the code (the best I can) but having issues with the right column.

    Any assistance would be greatly appreciated.

  • #6
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,335
    Thanks
    5
    Thanked 363 Times in 360 Posts
    Most people are converting tables INTO divs, not the other way around. Tables are used for tabular display and dynamic content, not for layout.

    Couldn't you have reworked the divs to suit your needs? It looks like a simply 3 column div with a header.

  • #7
    Regular Coder
    Join Date
    Oct 2010
    Location
    Florence, MS
    Posts
    486
    Thanks
    10
    Thanked 33 Times in 32 Posts
    Tee said exactly what I was thinking as I read your post, Mayhem. Using a table for a layout is a BIG NO NO. As he said, tables are used for displaying tabular data and should only be used as a last resort for anything else (if that). I HIGHLY suggest you avoid what you are doing.
    Notice: If you post a problem and it gets fixed, please remember to go back and place it as solved. ;)
    I always recommend the HEAD First series of books for learning a new coding language. ^_^

  • #8
    New Coder
    Join Date
    Jan 2010
    Posts
    68
    Thanks
    3
    Thanked 5 Times in 4 Posts
    Ok, is it possible to have div act like tables - where I can put content in the left, middle, right columns without hvaing to worry about the content overflowing to another column?

    I really want to get away from setting left margins to align the content in the proper columns.

  • #9
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,335
    Thanks
    5
    Thanked 363 Times in 360 Posts
    Quote Originally Posted by Mayhem30 View Post
    Ok, is it possible to have div act like tables - where I can put content in the left, middle, right columns without hvaing to worry about the content overflowing to another column?

    I really want to get away from setting left margins to align the content in the proper columns.
    Divs can work like tables, but much better. Do some reading here and here to understand how divs with CSS float properties work.

  • #10
    New Coder
    Join Date
    Jan 2010
    Posts
    68
    Thanks
    3
    Thanked 5 Times in 4 Posts
    Any off chance anyone here is looking for work?

    I'd be willing to pay someone to create a simple 3 column "blank template" for me using divs. It would need it to be like the one on GiftAuto.com

    Requirements :

    I believe this sizes listed below will fit in a 1024x768 browser window - let me know otherwise.

    Fixed width - centered (on all browsers)
    Left Column : 248px
    Middle Column : 540px (5px padding on left and right side only)
    Right Column : 133px

    I need the divs to behave as close to tables as possible. You must have done type of work before and know exactly what your doing.

    PM me if your interested + list any example sites you have done (if applicable)

  • #11
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,335
    Thanks
    5
    Thanked 363 Times in 360 Posts
    dude...lol 3 column layouts are easy. I can give you one, but you can adjust the widths as you need. Would that be ok??

  • #12
    Regular Coder
    Join Date
    Oct 2010
    Location
    Florence, MS
    Posts
    486
    Thanks
    10
    Thanked 33 Times in 32 Posts
    Mayhem, what Tee is saying is quite true. I am too modest to take a fee for something so simple.
    Notice: If you post a problem and it gets fixed, please remember to go back and place it as solved. ;)
    I always recommend the HEAD First series of books for learning a new coding language. ^_^

  • #13
    New Coder
    Join Date
    Jan 2010
    Posts
    68
    Thanks
    3
    Thanked 5 Times in 4 Posts
    I just want to know it's done right - I rather not have to modify the widths myself because a problem will arise ...

  • #14
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,335
    Thanks
    5
    Thanked 363 Times in 360 Posts
    Quote Originally Posted by Mayhem30 View Post
    I just want to know it's done right - I rather not have to modify the widths myself because a problem will arise ...
    Then you have no desire to learn? You should really look into a local web designer to design your site to your specifications. And the layout is a basic layout that works pretty much like you wanted. Im just not going to GIVE you something and then have to tweak every little aspect when you could easily do that yourself. or at least try.
    Last edited by teedoff; 11-10-2010 at 02:40 AM.

  • #15
    Regular Coder
    Join Date
    Oct 2010
    Location
    Florence, MS
    Posts
    486
    Thanks
    10
    Thanked 33 Times in 32 Posts
    Mayhem, just message me.
    Notice: If you post a problem and it gets fixed, please remember to go back and place it as solved. ;)
    I always recommend the HEAD First series of books for learning a new coding language. ^_^


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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