First table row is different?

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Kai Grossjohann

    First table row is different?

    In the following HTML code, the whitespace to the right of "bla" is
    clickable, whereas the whitespace to the right of "blubb" is not.
    That is, IE6 behaves like this. In Mozilla 1.4, both areas of
    whitespace are clickable.

    How do I make that whitespace (to the right of "blubb") clickable in
    IE6, too?

    It's okay to use something other than tables. Actually, I am trying
    to produce a column of "buttons" which stretch across the whole width
    of the frame. I'm still not sure how to get the 3d look that buttons
    in Windows normally have...

    tia,
    Kai

    PS: Frame layout is required because the user is supposed to be able
    to resize that column of buttons with the mouse.

    <html>
    <body>

    <table width="100%" border="1">
    <tr>
    <td>
    <a href="http://www.leo.org/">
    <div>bla</div>
    </a>
    </td>
    </tr>
    <tr>
    <td>
    <a href="http://www.google.com/">
    <div>blubb</div>
    </a>
    </td>
    </tr>
    </table>

    </body>
    </html>

  • Harlan Messinger

    #2
    Re: First table row is different?


    "Kai Grossjohann" <kai@emptydomai n.de> wrote in message
    news:8765i14bai .fsf@emptyhost. emptydomain.de. ..[color=blue]
    > In the following HTML code, the whitespace to the right of "bla" is
    > clickable, whereas the whitespace to the right of "blubb" is not.
    > That is, IE6 behaves like this. In Mozilla 1.4, both areas of
    > whitespace are clickable.[/color]

    A DIV is a block element. In valid HTML it cannot appear inside an A
    element. The browsers are reacting in their own respective, unpredictable
    ways to invalid code.
    [color=blue]
    >
    > How do I make that whitespace (to the right of "blubb") clickable in
    > IE6, too?
    >
    > It's okay to use something other than tables. Actually, I am trying
    > to produce a column of "buttons" which stretch across the whole width
    > of the frame. I'm still not sure how to get the 3d look that buttons
    > in Windows normally have...[/color]

    If you buttons, use images, with a rollover version if you'd like, and link
    them. Or try this CSS trick, which I've tested in IE6, Netscape 6, Netscape
    7, and Mozilla 1.5: (the "cursor" attribute works only in IE, and even there
    it doesn't persist when the cursor is over the button's label; maybe if I
    put the label in a span and gave the span a "cursor" style it would work)

    <html>

    <head>
    <style>
    .button {
    background-color: #cccccc;
    color: green;
    border-style: outset;
    border-width: 2px;
    margin: 5px;
    padding: 5px;
    cursor: hand;
    }
    .navbutton { width: 125px; }
    </style>
    </head>

    <body>

    <div
    class="button navbutton"
    onmouseover="th is.style.border Style='inset'"
    onmouseout="thi s.style.borderS tyle='outset'"
    onclick="locati on.href='http://www.leo.org'">L EO</div>

    <div
    class="button navbutton"
    onmouseover="th is.style.border Style='inset'"
    onmouseout="thi s.style.borderS tyle='outset'"
    onclick="locati on.href='http://www.google.com' ">Search Google</div>

    </body>
    </html>


    Comment

    • Kai Grossjohann

      #3
      Re: First table row is different?

      "Harlan Messinger" <h.messinger@co mcast.net> writes:
      [color=blue]
      > If you buttons, use images, with a rollover version if you'd like, and link
      > them. Or try this CSS trick, which I've tested in IE6, Netscape 6, Netscape
      > 7, and Mozilla 1.5: (the "cursor" attribute works only in IE, and even there
      > it doesn't persist when the cursor is over the button's label; maybe if I
      > put the label in a span and gave the span a "cursor" style it would work)[/color]

      It turns out that "cursor:pointer " seems to be the standard CSS way of
      doing things; it works on Mozilla 1.4 (I think) and IE 6 on W2k.

      Very nifty.

      We will now buy a professional Javascript package for getting the
      effect we wanted. It looks terrifyingly similar to the icons bar on
      the left of Microsoft Outlook, animation effects and all.

      Ah, the joy of hours wasted...

      Kai

      Comment

      • Harlan Messinger

        #4
        Re: First table row is different?


        "Kai Grossjohann" <kai@emptydomai n.de> wrote in message
        news:877k2e5sm3 .fsf@emptyhost. emptydomain.de. ..[color=blue]
        > "Harlan Messinger" <h.messinger@co mcast.net> writes:
        >[color=green]
        > > If you buttons, use images, with a rollover version if you'd like, and[/color][/color]
        link[color=blue][color=green]
        > > them. Or try this CSS trick, which I've tested in IE6, Netscape 6,[/color][/color]
        Netscape[color=blue][color=green]
        > > 7, and Mozilla 1.5: (the "cursor" attribute works only in IE, and even[/color][/color]
        there[color=blue][color=green]
        > > it doesn't persist when the cursor is over the button's label; maybe if[/color][/color]
        I[color=blue][color=green]
        > > put the label in a span and gave the span a "cursor" style it would[/color][/color]
        work)[color=blue]
        >
        > It turns out that "cursor:pointer " seems to be the standard CSS way of
        > doing things; it works on Mozilla 1.4 (I think) and IE 6 on W2k.[/color]

        Pointer is the normal arrow, isn't it? It becomes a hand when hovering over
        a hyperlink. That's what I was trying to get. "Hand" is in the CSS standard.
        [color=blue]
        >
        > Very nifty.[/color]

        Thanks.
        [color=blue]
        >
        > We will now buy a professional Javascript package for getting the
        > effect we wanted. It looks terrifyingly similar to the icons bar on
        > the left of Microsoft Outlook, animation effects and all.[/color]

        That should be easy. Just have alternate rollover files, load them with the
        page into Image objects, and then use Javascript to change the src
        attributes of the icons on mouseover and mouseout. I hope the software
        you're buying gives you more than that, or else only costs a few dollars.
        [color=blue]
        >
        > Ah, the joy of hours wasted...[/color]

        Comment

        • Kai Grossjohann

          #5
          Re: First table row is different?

          "Harlan Messinger" <h.messinger@co mcast.net> wrote in message news:<bodoi1$1d ct1u$1@ID-114100.news.uni-berlin.de>...[color=blue][color=green]
          > >
          > > We will now buy a professional Javascript package for getting the
          > > effect we wanted. It looks terrifyingly similar to the icons bar on
          > > the left of Microsoft Outlook, animation effects and all.[/color]
          >
          > That should be easy. Just have alternate rollover files, load them with the
          > page into Image objects, and then use Javascript to change the src
          > attributes of the icons on mouseover and mouseout. I hope the software
          > you're buying gives you more than that, or else only costs a few dollars.[/color]

          It's not that easy: the outlook bar can be made wider or narrower. So
          I would need several images: one for the left hand side 3d effect, one
          for the middle part of the button, and one for the right hand side 3d
          effect. The middle image would then be tiled to get to the right
          width, I guess.

          *shudder*

          I can barely draw a straight line with pencil on paper, and now I'm
          supposed to do these graphics tricks... Well, maybe I can find a
          colleague who is better at it than I am.

          Kai

          Comment

          • Harlan Messinger

            #6
            Re: First table row is different?


            "Kai Grossjohann" <Kai.Grossjohan n@gmx.net> wrote in message
            news:e808b168.0 311121002.5d328 665@posting.goo gle.com...[color=blue]
            > "Harlan Messinger" <h.messinger@co mcast.net> wrote in message[/color]
            news:<bodoi1$1d ct1u$1@ID-114100.news.uni-berlin.de>...[color=blue][color=green][color=darkred]
            > > >
            > > > We will now buy a professional Javascript package for getting the
            > > > effect we wanted. It looks terrifyingly similar to the icons bar on
            > > > the left of Microsoft Outlook, animation effects and all.[/color]
            > >
            > > That should be easy. Just have alternate rollover files, load them with[/color][/color]
            the[color=blue][color=green]
            > > page into Image objects, and then use Javascript to change the src
            > > attributes of the icons on mouseover and mouseout. I hope the software
            > > you're buying gives you more than that, or else only costs a few[/color][/color]
            dollars.[color=blue]
            >
            > It's not that easy: the outlook bar can be made wider or narrower.[/color]

            If you look more closely, you'll see that the active area doesn't change in
            size when you do that, at least not in Outlook 2002. The area outside the
            images doesn't cause the rollover effect and isn't hyperlinked. It's no
            different from centering hyperlinked images inside a table cell or DIV.
            [color=blue]
            > So
            > I would need several images: one for the left hand side 3d effect, one
            > for the middle part of the button, and one for the right hand side 3d
            > effect. The middle image would then be tiled to get to the right
            > width, I guess.
            >
            > *shudder*
            >
            > I can barely draw a straight line with pencil on paper, and now I'm
            > supposed to do these graphics tricks... Well, maybe I can find a
            > colleague who is better at it than I am.[/color]

            Eh, mouseovers really aren't tough. Just tedious.
            [color=blue]
            >
            > Kai[/color]

            Comment

            • Kai Grossjohann

              #7
              Re: First table row is different?

              "Harlan Messinger" <h.messinger@co mcast.net> writes:
              [color=blue]
              > If you look more closely, you'll see that the active area doesn't change in
              > size when you do that, at least not in Outlook 2002. The area outside the
              > images doesn't cause the rollover effect and isn't hyperlinked. It's no
              > different from centering hyperlinked images inside a table cell or DIV.[/color]

              Ah, you're talking about the things with the icons next to them.
              Those are fairly easy.

              I'm talking about the grey buttons. The bottommost one says "My
              Links" (or something similar, I'm translating from German "Eigene
              Verknüpfungen" here).

              If you make the outlook bar wider then the buttons will also be wider,
              and there is a 3d effect to them.

              Kai

              Comment

              • Harlan Messinger

                #8
                Re: First table row is different?


                "Kai Grossjohann" <kai@emptydomai n.de> wrote in message
                news:8765hoxbhx .fsf@emptyhost. emptydomain.de. ..[color=blue]
                > "Harlan Messinger" <h.messinger@co mcast.net> writes:
                >[color=green]
                > > If you look more closely, you'll see that the active area doesn't change[/color][/color]
                in[color=blue][color=green]
                > > size when you do that, at least not in Outlook 2002. The area outside[/color][/color]
                the[color=blue][color=green]
                > > images doesn't cause the rollover effect and isn't hyperlinked. It's no
                > > different from centering hyperlinked images inside a table cell or DIV.[/color]
                >
                > Ah, you're talking about the things with the icons next to them.
                > Those are fairly easy.
                >
                > I'm talking about the grey buttons. The bottommost one says "My
                > Links" (or something similar, I'm translating from German "Eigene
                > Verknüpfungen" here).[/color]

                If there are three sections labeled "Outlook Verknüpfungen", "Eigene
                Verknüpfungen", and "Andere Verknüpfungen" (Outlook Shortcuts, My Shortcuts,
                Other Shortcuts), then we're both talking about the Outlook Bar, and in
                Outlook 2002 (US version), at least, these buttons do not change size. If
                you do want that feature, then I guess it is easier to buy it.
                [color=blue]
                >
                > If you make the outlook bar wider then the buttons will also be wider,
                > and there is a 3d effect to them.
                >
                > Kai
                >[/color]

                Comment

                • Kai Grossjohann

                  #9
                  Re: First table row is different?

                  "Harlan Messinger" <h.messinger@co mcast.net> wrote in message news:<bp0tur$1j ajk3$1@ID-114100.news.uni-berlin.de>...[color=blue]
                  >
                  > If there are three sections labeled "Outlook Verknüpfungen", "Eigene
                  > Verknüpfungen", and "Andere Verknüpfungen" (Outlook Shortcuts, My Shortcuts,
                  > Other Shortcuts), then we're both talking about the Outlook Bar, and in
                  > Outlook 2002 (US version), at least, these buttons do not change size. If
                  > you do want that feature, then I guess it is easier to buy it.[/color]

                  Amazing. I just tried (with Outlook 2000) and made the outlook bar
                  very wide (across approx 1/2 of the screen, it wouldn't go wider), and
                  those buttons were as wide as the outlook bar. And I tried to click
                  on the very left and also on the very right, and also in the middle of
                  such a button (Eigene Verknüpfungen), and all three clicks invoked the
                  button function.

                  I then tried to click on one of the links themselves (Outlook Heute =
                  Outlook Today, I guess), and these links indeed did NOT grow. So
                  after making the outlook bar wide, there is a lot of dark-grey
                  unusable space to the left and to the right of the links.

                  Kai

                  Comment

                  Working...