ClipArt Header

This topic is: not resolved

This topic contains 25 replies, has 4 voices, and was last updated by  Ozzy 1 year, 12 months ago.

Viewing 11 posts - 16 through 26 (of 26 total)
  • Author
    Posts
  • #6991

    shellbrodnax
    Participant
    Post count: 2

    Tried all versions. I have the header set to 940. I think that was the original. Actually, it was 240 wide, as it only went on the left side. I am sure it has to do with padding or margines, but no matter what I set it to, it either goes left or right, or centered then you see the background on both sides

    #6994

    shellbrodnax
    Participant
    Post count: 2

    I dont have white space at the top. The now all purple test header I want to go all the way across the site like the large slider area does in the middle of the site, or the footer does at the bottom.

    #6997

    Ozzy
    Participant
    Post count: 214

    it looks like you’re trying to add the dotted line as an image, but you should be able to add that with some css. if that’s ok, try this:

    #header {
    background: url(“http://itsacharmedworld.com/wp-content/uploads/2012/12/cropped-header-test.jpg”) repeat scroll 0 0 transparent;
    border-bottom: 1px dashed #ffffff; //change this to whatever color your dotted line is in the image
    width: 100%;
    }

    #header .wrap {
    margin: 0 auto;
    max-width: 940px;
    width: 100%;
    }

    remove the background in the .header-image #header #title-area as well as #header .wrap and you should be good to go :)

    the forum doesn’t allow the quotes, but hopefully you understand what i’m trying to say… hopefully


    • This reply was modified 1 year, 12 months ago by  Ozzy.
    • This reply was modified 1 year, 12 months ago by  Ozzy. Reason: quotes won't show
    • This reply was modified 1 year, 12 months ago by  Ozzy.
    • This reply was modified 1 year, 12 months ago by  Ozzy. Reason: quotes won't show
    #7000

    Riavon
    Participant
    Post count: 95

    Try this:

    #header .wrap {
    background: url(“images/bg-dotline.png”) repeat-x center bottom transparent;
    margin: 0;
    padding: 0;
    width: 100%;
    }

    .header-full-width #title-area,
    .header-full-width #title,
    .header-full-width #title a {
    float: none;
    height: 150px;
    margin: 0 auto;
    width: 1340px;
    }

    .header-image #header #title-area {
    background: url(“http://itsacharmedworld.com/wp-content/uploads/2012/12/cropped-header-test.jpg”) no-repeat 50% 0 transparent;
    display: block;
    float: none;
    height: 150px;
    margin: 0 auto;
    padding:0;
    width: 1060px;
    }

     

    Sorry @Ozzy looks like we were both posting at the same time!


    Twitter: @riavonentprises

    • This reply was modified 1 year, 12 months ago by  Riavon. Reason: acknowlege Ozzy
    • This reply was modified 1 year, 12 months ago by  Riavon. Reason: acknowlege Ozzy
    #7009

    Ozzy
    Participant
    Post count: 214

    it’s quite alright, Riavon! two heads are better than one!


    #7049

    shellbrodnax
    Participant
    Post count: 2

    well, tried this as well. now its centered. but still the background is to the left and right.

    #7054

    Ozzy
    Participant
    Post count: 214

    can you try my suggestion above? it’s a little different than Riavon’s response


    #7065

    Riavon
    Participant
    Post count: 95

    I don’t know what you want your header to actually be, since now it is just a lavender colored block… but you can make the background color to match that lavender for #header .wrap

    #header .wrap {
    background: url(“images/bg-dotline.png”) repeat-x center bottom #9299cd;
    margin: 0;
    padding: 0;
    width: 100%;
    }

    Screenshot of what that looks like here: http://tinypic.com/r/1677bkn/6


    Twitter: @riavonentprises

    • This reply was modified 1 year, 12 months ago by  Riavon. Reason: added link to screenshot
    • This reply was modified 1 year, 12 months ago by  Riavon. Reason: added link to screenshot
    #7070

    shellbrodnax
    Participant
    Post count: 2

    Ozzy, I have tried, its not working. The now lavender header, is just a test header. Whatever header I put in there, I want it to go all the way across the page. I am not trying to do anything with the dotted lines. I just want a header that goes all the way across, so i don’t see the diamond background on the side of it.

    I really appreciate all the help.

    #7071

    Ozzy
    Participant
    Post count: 214

    you’re almost there, shell!

    you need to add the image into the #header rule


    • This reply was modified 1 year, 12 months ago by  Ozzy. Reason: used pastie
    • This reply was modified 1 year, 12 months ago by  Ozzy. Reason: used pastie
    #7074

    Ozzy
    Participant
    Post count: 214

    you can go here http://pastie.org/5566880 and see what you need to add to the #header style


Viewing 11 posts - 16 through 26 (of 26 total)

You must be logged in to reply to this topic.