Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Carve Out of a box

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #35659
    angelazou
    Participant

    So, this is something I’m hoping to achieve using CSS. I want a row to be filled with a certain color. And then, I want to place a block element, such as a header, that uses a different background color so it kind of creates this illusion of a shape carving out of another shape.
    I tried it at http://jsfiddle.net/e6Uex/, but it didn’t work. (If I try the styles with h1 element, the styles applied to the outer class doesn’t even work. But if I try the styles with inner class, the styles applied to the outer class take affect, but the inner class doesn’t) Even if I use z-index to bring up the inner element. I’m writing to see if this is possible, and if so, how can I achieve this effect?

    Angela

    #92803
    angelazou
    Participant

    Here is a new one http://jsfiddle.net/4jJ7r/

    #92812
    angelazou
    Participant

    Great, thank you. One more question though. Right now, this is what my titles look like. http://jsfiddle.net/wvJHt/, but I want to squeeze the title a little bit down so it looks integrated into the white space, rather than hidden inside the row.
    I’ve tried negative margins and padding, but both failed to move the title. Am I missing something?

    Angela

    #92816

    Your link is dead.

    #92818
    angelazou
    Participant

    Don’t try to click on the link because that will include the comma after it, remove the comma and try again.

    #92829
    angelazou
    Participant

    Sorry, I mean I want to move the title and the h1 (box) around it down a little so it doesn’t look like it’s a rectangle inside a rectangle. Because the background is going to be white, so I wonder if I can push this box down a little so the white space (from the background and the inner box) join together.

    Angela

    #92833
    angelazou
    Participant

    ah, I should have done that, but it just didn’t seem to cross my mind by then. Thanks.

Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘CSS’ is closed to new topics and replies.