Rachelbuccalo

Site URL: https://www.rachelcruzbuccalo.com/ Hello all, I am looking for any help/advice on how to get rid of the underline beneath the active page's navigational link. Currently, I have code that bolds the links on hover, but I'm having trouble with the code that would remove all underlines from the header. I have successfully removed the underlines from links in text sections. Below I will attach the code currently applied to the header and a screenshot of the navigation bar when the Work Page is open. Thank you! a { text-decoration: none !important; } a { background-image: none !important; } header a:hover { font-weight: 900; } .header-nav-folder-content {background-color: transparent!important} .header-announcement-bar-wrapper [href="/main-navigation"], .header-menu--folder-list .header-menu-nav-item [href="/main-navigation"]{ background-image: url(https://www.freeiconspng.com/thumbs/cross-png/cross-png-28.png)!important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center center !important; color: transparent !important; } /* dropdown menu text size */ .header-nav-folder-content a { font-size: 18px; } .header .header-layout-nav-right .header-nav .header-nav-item--folder .header-nav-folder-content { right: -100px !important; } .header-nav .header-nav-item--folder .header-nav-folder-content { top: -9px !important; }

It worked - thank you so much @AZIM2121 ! Do you have any advice on how to fix the bold on hover in navigation? *I adjusted some of the values so the final code was: .header .header-layout-nav-right .header-nav .header-nav-item--folder .header-nav-folder-content { right: -100px !important; } .header-nav .header-nav-item--folder .header-nav-folder-content { top: -9px !important; }

Site URL: https://www.rachelcruzbuccalo.com/ Hello all, I would appreciate any help on building custom css that would align my navigational links to the left of my navigational folder, which I've custom coded to be an image of a cross. Currently, the navigational links ("Work" and "About") are situated far below the cross, but I would like for them to be directly to the left of the image or even bottom left of the image. Neither padding or left/right values have successfully moved the text. Below is a screenshot of the current header layout. I'd also appreciate any advice on how to make the navigational links bolded when hovered over/clicked on. At the moment, they become bold when hovered over, but when the page is clicked on the link is underlined instead of bolded. Is there a way to bold the active link, remove the underline, all without disrupting the background image I've coded to produce the cross? I will attach all of the code currently applied to my header text below. Thank you for your guidance! a { text-decoration: none !important; } header a { text-decoration: none !important; } a { background-image: none !important; } header a { background-image: none !important; } header a:hover { font-weight: 900; } header a:active { font-weight: bold !important; } .header-nav-folder-content {background-color: transparent!important} .header-announcement-bar-wrapper [href="/main-navigation"], .header-menu--folder-list .header-menu-nav-item [href="/main-navigation"]{ background-image: url(https://www.freeiconspng.com/thumbs/cross-png/cross-png-28.png)!important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center center !important; color: transparent !important; } /* dropdown menu text size */ .header-nav-folder-content a { font-size: 18px; }