Restyle Anchor

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

    Restyle Anchor

    Hello,

    On a bottom of a form I have 2 buttons: Submit and Cancel.

    Submit is an input and submits the form.
    Cancel should just redirect the user to a new page without
    submitting the form.

    I need the Cancel button to look the same as the Submit button.
    If I use an input of type button as Cancel button I am able to do that
    but then I need to rely on "onclick" to redirect the user ... I think
    would be better to use an anchor.

    However, I am having a problem in styling the anchor to make it look
    the same as the Submit input.

    Could someone tell me how to style the anchor and if using an anchor
    is better then using the button?

    My code:


    Thanks,
    Miguel
  • Jonathan N. Little

    #2
    Re: Restyle Anchor

    shapper wrote:
    Hello,
    >
    On a bottom of a form I have 2 buttons: Submit and Cancel.
    >
    Submit is an input and submits the form.
    Cancel should just redirect the user to a new page without
    submitting the form.
    >
    I need the Cancel button to look the same as the Submit button.
    If I use an input of type button as Cancel button I am able to do that
    but then I need to rely on "onclick" to redirect the user ... I think
    would be better to use an anchor.
    Or you can have the "cancel" button in another form that submits
    "nothing" to that other page

    <form action="scriptT hatDoesDomethin g.php">
    ....
    <input type="submit" value="Submit Form">
    </form>

    <form action="theOthe rPage.php">
    <input type="submit" value="Cancel">
    </form>


    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO

    Comment

    • shapper

      #3
      Re: Restyle Anchor

      On Jun 25, 12:50 am, "Jonathan N. Little" <lws4...@centra l.netwrote:
      shapper wrote:
      Hello,
      >
      On a bottom of a form I have 2 buttons: Submit and Cancel.
      >
        Submit is an input and submits the form.
        Cancel should just redirect the user to a new page without
      submitting the form.
      >
      I need the Cancel button to look the same as the Submit button.
      If I use an input of type button as Cancel button I am able to do that
      but then I need to rely on "onclick" to redirect the user ... I think
      would be better to use an anchor.
      >
      Or you can have the  "cancel" button in another form that submits
      "nothing" to that other page
      >
      <form action="scriptT hatDoesDomethin g.php">
      ...
      <input type="submit" value="Submit Form">
      </form>
      >
      <form action="theOthe rPage.php">
      <input type="submit" value="Cancel">
      </form>
      >
      --
      Take care,
      >
      Jonathan
      -------------------
      LITTLE WORKS STUDIOhttp://www.LittleWorks Studio.com
      Is this usually done? Having a form just redirecting to a page?
      However, I have a problem: I need to place both buttons side by side
      and in that case I think it will not be possible.

      Finally, could I place a input of type button inside an anchor? What
      do you think?

      Thanks,
      Miguel

      Comment

      • Jonathan N. Little

        #4
        Re: Restyle Anchor

        shapper wrote:
        On Jun 25, 12:50 am, "Jonathan N. Little" <lws4...@centra l.netwrote:
        >shapper wrote:
        >>Hello,
        >>On a bottom of a form I have 2 buttons: Submit and Cancel.
        >> Submit is an input and submits the form.
        >> Cancel should just redirect the user to a new page without
        >>submitting the form.
        >>I need the Cancel button to look the same as the Submit button.
        >>If I use an input of type button as Cancel button I am able to do that
        >>but then I need to rely on "onclick" to redirect the user ... I think
        >>would be better to use an anchor.
        >Or you can have the "cancel" button in another form that submits
        >"nothing" to that other page
        >>
        ><form action="scriptT hatDoesDomethin g.php">
        >...
        ><input type="submit" value="Submit Form">
        ></form>
        >>
        ><form action="theOthe rPage.php">
        ><input type="submit" value="Cancel">
        ></form>
        <snip signature>
        Is this usually done? Having a form just redirecting to a page?
        However, I have a problem: I need to place both buttons side by side
        and in that case I think it will not be possible.
        Sure you can, careful markup style as you need to...
        >
        Finally, could I place a input of type button inside an anchor?
        What good would that do?



        --
        Take care,

        Jonathan
        -------------------
        LITTLE WORKS STUDIO

        Comment

        • Jonathan N. Little

          #5
          Re: Restyle Anchor

          Jonathan N. Little wrote:
          Oops, always double check in IE! IE has a default bottom margin on
          forms, so add a third rule to line up buttons
          <style type="text/css">
          div.wrapper { position: relative; min-width: 15em; }
          div.wrapper form.nogo { position: absolute; right: 0; bottom: 0;}
          div.wrapper form { margin: 0; }


          --
          Take care,

          Jonathan
          -------------------
          LITTLE WORKS STUDIO

          Comment

          • shapper

            #6
            Re: Restyle Anchor

            On Jun 25, 3:15 pm, "Jonathan N. Little" <lws4...@centra l.netwrote:
            Jonathan N. Little wrote:
            >
              Oops, always double check in IE! IE has a default bottom margin on
            forms, so add a third rule to line up buttons
            >
             <style type="text/css">
             div.wrapper { position: relative; min-width: 15em; }
             div.wrapper form.nogo { position: absolute; right: 0; bottom: 0;}
            >
            div.wrapper form { margin: 0; }
            >
            --
            Take care,
            >
            Jonathan
            -------------------
            LITTLE WORKS STUDIOhttp://www.LittleWorks Studio.com
            Hmmm, thank you for the help, but it does not work.
            I need the two buttons to be side by side ... even if I set a right
            margin to cancel button they will overlap on text resizing.

            I will keep trying ...

            Thanks,
            Miguel

            Comment

            • Jukka K. Korpela

              #7
              Re: Restyle Anchor

              Scripsit shapper:
              On a bottom of a form I have 2 buttons: Submit and Cancel.
              Wrong design. The "Cancel" button is really a "destroy whatever the user
              has done" button.
              Submit is an input and submits the form.
              Cancel should just redirect the user to a new page without
              submitting the form.
              Pointless. No need to style it. Redesign it.

              --
              Jukka K. Korpela ("Yucca")


              Comment

              Working...