# Cannot get a named anchor to work in CSS **URL:** \ **Category:** General\ **Created:** [September 24, 2020, 9:36pm UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554 "2020-09-24T21:36:45Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\ **Post date:** [September 24, 2020, 9:36pm UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/1 "2020-09-24T21:36:45Z")
**Need Help** I’m trying to use CSS to create a named anchor on my homepage on [https://rjrwebz.com](https://rjrwebz.com). I want the “Send Email” button on my “Getting Started…” form to scroll the page to the top of the column containing the form so the confirmation message is shown - but it goes to the top of the page like a refresh and thus the user will not see the confirmation message. Would someone please visit my [site](https://rjrwebz.com) to review the homepage’s “Getting Started…” form and let me know what I’m doing wrong. I want the button, when clicked, to scoll the page to the top of the column and not the top of the page (i.e., no refresh). ---
**Author:** ![droidgoo](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/droidgoo/32/2209_2.png) [@droidgoo](https://forum.pinegrow.com/u/droidgoo)\ **Post date:** [September 25, 2020, 1:42am UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/2 "2020-09-25T01:42:43Z")
you have to use ID, not name. give the element you want to scroll to the `id="gohere"` and then put `#gohere` in the href. looking at ur page, it all looks like it should work, but ur putting the id on a div rather than a text element (don’t know why that would make any diff, but). try this instead `

Step 1.

` oh, i see the problem (i think)… your action on the submit button is NULL which will take you to the top of the page, when what you really want is a redirect to `https://www.rjrwebz.com/rjrwebz#formtop` also not sure what `formaction=""` is doing for you, if anything… the action up in the form element is what determines the form behavior. i’m not sure but i think having the form input inside of an anchor might be working double duty… i don’t think you want the anchor. ---
**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\ **Post date:** [September 25, 2020, 9:52am UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/3 "2020-09-25T09:52:07Z")
Hi @randyrie I agree with @droidgoo that you likely need to set some type of action for the form. You don’t need to use a formaction on the button unless you want some type of alternate redirect. Also, according to the HTML5 standards, you shouldn’t wrap any interactive element (like a button) in a link. ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/5/52d8aef86f7198d1c48ba0f46cb61f6740192e78.png) Depending on browser it could give some unexpected behavior, plus, it might throw off your page ranking and you don’t need it. Instead, add the anchor to your form action. `action="/send-location.html#formtop"` Hope this helps ---
**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\ **Post date:** [September 25, 2020, 4:04pm UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/4 "2020-09-25T16:04:09Z")
@RobM AND @droidgoo Thanks for responding. I’ve resolved the problem. When I took a closer look, I noticed I placed the ID in the wrong div tag. ARGH! ---
**Author:** ![mxs](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/mxs/32/2943_2.png) [@mxs](https://forum.pinegrow.com/u/mxs)\ **Post date:** [September 29, 2020, 2:13pm UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/5 "2020-09-29T14:13:35Z")
I noticed you could send an empty email - put ‘required’ into input type to stop spambots. input required type=“text” name=“FullName” id=“FullName” placeholder=“Full Name” ---
**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\ **Post date:** [August 20, 2021, 6:14pm UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/6 "2021-08-20T18:14:27Z")
I’m trying to figure out how to get a scrolling row to stop at a certain point when I hit a button in my navbar that links to a named anchor in the row’s first column (I’ve anchored to the FaithCentre logo in the white box). this is the button on my navbar: ![navbar](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/7/742d8a6593b7a8fe37416dd5a8c519fd38126d0e.jpeg) Here is where I want the scrolling row to stop/open… with spacing between the column top and the browser’s top: ![Screen Shot 2021-08-20 at 1.26.05 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/6/60409559d75b0febfdef93738e70e494f3a9f26e.jpeg) But here is where it opens… the column is up too far: ![Screen Shot 2021-08-20 at 1.26.25 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/5/51b1d51b513cc81206461696ac291d7b37ec7786.jpeg) I’ve tried placing the column higher, above the row, but this didn’t do the trick.How do I set this ‘correctly’ in PineGrow? ---
**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\ **Post date:** [August 20, 2021, 9:06pm UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/7 "2021-08-20T21:06:05Z")
Hi @randyrie, So there are two CSS properties, `scroll-padding-top` and `scroll-margin-top` that may work for you. They aren’t supported by IE and actually, for Chrome there is a bug, so you have to use the short hand form: `scroll-padding: a b c d;` Where a is the top value, b the right value, c the left value, and d the bottom value. Using `:target:before` can be a bit problematic. The only other solution is to use JavaScript (I think). Cheers, Bob ---
**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\ **Post date:** [August 21, 2021, 12:22am UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/8 "2021-08-21T00:22:31Z")
Thanks again @RobM for your quick response. I assume the scroll-margin-top property should be added to the inline style for the **row** and not the **anchor** I want affected? Like: style=“scroll-margin-top: 200px;” Am I on track? ---
**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\ **Post date:** [August 21, 2021, 9:36am UTC](https://forum.pinegrow.com/t/cannot-get-a-named-anchor-to-work-in-css/4554/9 "2021-08-21T09:36:23Z")
Hi @randyrie, You would add it to the element that has the id that you are targeting for the scroll. Not sure what that element is. Then just set the top to be large enough to include what you need. You don’t have to use `px`, any unit will work. Cheers, Bob