Help with CSS background and a text

Discussion in 'Web Design and Development' started by Got Josh?, Sep 9, 2009.

  1. Got Josh? macrumors member

    Joined:
    Mar 27, 2009
    #1
    Hello All,

    I help with the background notice how it chops and the end? I need to make the makeground repeatable all over the screen without choping off and i also need to move JUST the text on the A's witout it losing it properties a little bit down. Any help with this would be greartly appreciated.


    Here's the website:
    http://bibliotecapjb.com/fabe_dev/
     
  2. Dunmail macrumors regular

    Joined:
    Mar 27, 2009
    Location:
    Skipton, UK
    #2
    You've got this rule in your CSS:

    #main .container {
    background-image:url(images/background_light.jpg);
    min-height:675px;
    background-repeat:no-repeat;
    }

    Change it to:

    #main .container {
    background-image:url(images/background_light.jpg);
    min-height:675px;
    background-repeat:repeat-y;
    }

    You could also make the image smaller vertically once you do this, though make sure that the pattern lines up.

    Your links are doing what you have told them to do: what you need to do is -

    background-position:top;

    for the image and

    vertical-align:text-bottom;

    for the text. Then play around a bit. Note that I haven't tried this with your page.

    Also, I notice that you are using absolute positioning - what happens when you shrink the width of the browser window?
     
  3. Got Josh? thread starter macrumors member

    Joined:
    Mar 27, 2009
    #3
    Thanks for the help! I fixed the a's problems but the background problem still persist i tried repeat-y before and it still isn't working. Also has you said if i shrink the browser window the background gets messed up, how do i fix this?
     
  4. Dunmail macrumors regular

    Joined:
    Mar 27, 2009
    Location:
    Skipton, UK
    #4
    Try the minimum HTML with basic CSS that works before adding anything, just get the background to display properly first.

    You need to use a floating layout using percentages but specify a minimum width of something like 800px
     

Share This Page