Grow your CSS skills. Land your dream job.

CSS Trouble

  • # October 7, 2011 at 4:13 pm

    Hi…I am trying to make an image that I have placed in my css to grow along when content is added.

    .content
    {
    background: url(‘images/Menu/3dBkgContent.png’) ;
    height: 100%;
    padding: 20px;
    text-align: left;
    z-index: -999;
    position: relative;
    }

    I am trying to get it to grow as more an more content is added.
    i.e.
    DIV CONTENT
    Everything goes here and as more is added, so will the image, I want it to stretch in the y-axis
    /DIV

    Also, I am trying to place my navigation circles to go over my header and content:
    HEADER
    NAVIGATION< ---I want this to overlap the HEADER and CONTENT

    CONTENT

    I found a sample of what I am going for here

    # October 7, 2011 at 4:35 pm

    Uhh I was going to reply, but lost my train of thought when I seen the blonde lol…

    What type of image is this image? If it is a graphic or pattern, use:



    .content {
    background-image: url('images/Menu/3dBkgContent.png');
    background-repeat:repeat-y;

    or



    .content {
    background: url('images/Menu/3dBkgContent.png') repeat-y 0 0;

    # October 7, 2011 at 6:36 pm

    sorry about the image…it was basically the website that I was going for and it is similar to mine.
    the image I use is just a white with rounded corners…built it up in psd and then saved it as a png…But, when I put it in with my css (i’m using css3), it works good when I debug…but when I add content on my pages, it won’t grow in length.
    The web site that I showed, their navigation buttons is like what I have, and how they have it set up, is what I’m trying to get. If you look at the page (once done admiring the blonde…lol) where there content is, that is the type of body content I have..its just white with rounded corners and an asp:content placeholder.
    Then, again, with the navigation, its just like that site. i’m trying to get the div.nav to over lap the div.header and div.content.

    # October 7, 2011 at 6:39 pm

    did I mention the content image is width 1000 and the height is only 200…but, like i said, I’m trying to let the top and bottom expand (basically the middle part to grow as content is added)

    # October 7, 2011 at 6:43 pm

    i did repeat-y…but, it does the same image again.
    If you go to that web page, and see the content where everything goes, thats the effect of the div.content I’m shooting for.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".