1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

How to merge header and body background

Discussion in 'XenForo Development Discussions' started by Ra, Oct 12, 2010.

  1. Ra

    Ra Active Member

    and preserve background modification through the body settings in admin

    three more things:
    1 how to turn off repeat of the bg picture
    2 how to make bg picture resizable in width 1920-to-iphone size
    3 how to auto add fog below the bg picture if the forum stretches down farther than the size of the background pic.

    :confused:

    smth like that
     

    Attached Files:

    khaledov likes this.
  2. Ra

    Ra Active Member

    uhu

    i used the same color for logo area and background - it looks then the whole thing
    but i want to make a picture as my background

    and i made a reload rotation of the pics - but then "no repeat" doesn't work and make it tiled on a wide screen
     
  3. Elizabeth

    Elizabeth Well-Known Member

    Ra, after putting in your background, comment out this section:
    ACP>Styles>Your Style>Style Properties>Header & Navigation>Header>Background. (Click on the color bar and when the color palette pops up, put a check mark in "clear value".
    Also go to the Templates>Your Style>header.css and delete this:
    Code:
    {
    	@property "header";
    	background-color: @primaryMedium;
    	@property "/header";
    }
    
    It's right at the top of the header.css
     
    Ra likes this.
  4. Ra

    Ra Active Member

    checking out..


    yes, thank you! that's what i wanted.


    still tiled with clones background.. went to find why
     
  5. Elizabeth

    Elizabeth Well-Known Member

    You're welcome....
    For the clones background, make sure your photo is big enough or it will tile.
     
    Ra likes this.
  6. Nick

    Nick Well-Known Member

    Is the second step necessary? IIRC, all I had to do was make the header background transparent, so the underlying body background gradient would start at the top (i.e. behind the header). I never had to remove the code from the template.
     
  7. Ra

    Ra Active Member

    (it worked without the deletion)

    that's clear, but why then there's a "no-repeat" function for the bground?
    btw how to use "position" field? (any faq link)
    attached is my current setting
     

    Attached Files:

  8. Nick

    Nick Well-Known Member

    1 - How large is your image?
    2 - For "position", try entering top.
     
  9. Elizabeth

    Elizabeth Well-Known Member

    No, but it works best that way. You can leave that step out but I prefer the way I mentioned. YMMV. (Your Mileage May Vary)
     
  10. Nick

    Nick Well-Known Member

    Why? (I'm not questioning your preference; just curious so I can learn, as I've never been very fluent with CSS, so to speak)
     
  11. Ra

    Ra Active Member

    the question is "how to make all images in rotation resizable along with the forum resize" from 1920 to iphone - without left-right shift and tiling

    i use different sizes while testing
     
  12. island

    island Active Member

    I don't think you can yet do a background image that scales to 100% height and 100 % width - a workaround is to create one "background" layer div with just an image that is 100% width 100% height and then create another layer "container" div on top that contains everything else.
     
  13. Ra

    Ra Active Member

    hey hey I m not so sophisticated
    count me as a noob :D
    any samples?
    (and no fogging ideas? in the sample above it's always new background with a hand-made fog and logo - that's not a good idea..)

    stuck with this
     

    Attached Files:

  14. Ra

    Ra Active Member

    updated to beta 2
    found, that styles folder had double slash and double rotation.php
    cleared all
    got to footer.css and cleared background line

    fixed
     

Share This Page