how and where to make css changes

Discussion in 'HTML' started by richard, Apr 22, 2014.

  1. richard

    richard Guest

    http://mroldies.net/menupad1.html

    In this item I need to know what creates the little white triangle in the
    light blue opaque area.

    I can change the height of the lines to narrow the highlighted area, but
    when I do that, the position of that little triangle also changes.

    The claim is that it is also touch screen friendly. Is it? I don't know as
    I do not have a touch screen.
     
    richard, Apr 22, 2014
    #1
    1. Advertisements

  2. | http://mroldies.net/menupad1.html
    |
    | In this item I need to know what creates the little white triangle in the
    | light blue opaque area.

    <span class="pointer"><span class="point"></span></span>

    | I can change the height of the lines to narrow the highlighted area, but
    | when I do that, the position of that little triangle also changes.
    |
    | The claim is that it is also touch screen friendly. Is it? I don't know as
    | I do not have a touch screen.
     
    David Postill, Apr 22, 2014
    #2
    1. Advertisements

  3. richard

    JJ Guest

    It's on this CSS selector:

    ..container .pointer .point

    The triangle is the left border with transparent top and bottom border, on a
    DIV with zero width and height. There's no need for the right side border.

    When you define a non zero DIV (e.g.: 100x100) with 4 different color 30px
    thick border, you'll see that on the corner, the color separation is
    diagonal. Zero the width and height of the DIV and you'll get pyramid like
    layout viewed directly from above. Make the top, right, and bottom border
    colors as transparent and you'll get the right pointing triangle.
     
    JJ, Apr 22, 2014
    #3
  4. richard

    richard Guest

    Thanks. I had the idea that was the line but wasn't sure just how the
    triangle got created.
    I saw the zero height and width and was like WTF?
     
    richard, Apr 22, 2014
    #4
  5. richard

    dorayme Guest

    dorayme, Apr 22, 2014
    #5
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.