Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'navigation-link'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location

Found 58 results

  1. I am trying to edit the colour of any link text on my site - both in the navigation and on pages - using 7.1. The option doesn't seem available in site styles/ themes, which seems odd as it's a fairly basic request. I'd like the hover over/ active colour to be #01aef0. I would also like the colour to remain when you are on a page - so when you are on the About page, the navigation title stays as the hover colour as an indicator. Sorry I don't know how else to describe that! My site is carbonbuddyproject.org Thanks, Emma.
  2. How can I change the colour of underlines for the entire site to #C3B581. Including heading underlines and link underlines https://cube-dogfish-ly5w.squarespace.com/contact Password: ironwood
  3. I want to switch the navigation from horizontal to vertical. Is there a way to do this on the Mojave template?
  4. (Updated: SS 7.1) Some custom code (CSS) to change color Navigation Link Navigation Hover Link Navigation Active Link Notes Add code to Home > Design > Custom CSS The code is based on demo at squarespace.com/templates, so they may not work for some websites or navigation with dropdown If the code doesn't work, try adding !important to after, eg: color: #f1f2f3 !important; If you have any questions/found issues, just comment below or send me a private message. Thanks. Avenue Template /* Nav item color */ .main-nav ul li a { color: #ff0000 !important; } /* Nav item hover color */ .main-nav ul li a:hover { color: violet !important; } /* Nav item active color */ .main-nav ul li.active-link a { color: green !important; } Aviator /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Bedford Family: Anya, Bedford, Bryant, Hayden, Bedford /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Brine Family: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West, Brine. /* Nav item color */ .Header-nav-item { color: #ff0000 !important; } /* Nav item hover color */ .Header-nav-item:hover { color: violet !important; } /* Nav item active color */ .Header-nav-item--active { color: green !important; } Farro: Farro, Haute Same as Brine Five /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Flatiron /* Nav item color */ ul#nav li a { color: #ff0000 !important; } /* Nav item hover color */ ul#nav li a:hover { color: violet !important; } /* Nav item active color */ ul#nav li.active-link a { color: green !important; } Forte /* Nav item color */ #topNav ul li a span { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover span { color: violet; } /* Nav item active color */ #topNav ul li.active-link a span { color: green !important; } Ishimoto /* Nav item color */ #topNav #nav li a { color: #ff0000; } /* Nav item hover color */ #topNav #nav li a:hover { color: violet; } /* Nav item active color */ #topNav #nav li.active-link a { color: green !important; } Momentum /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } Montauk: Julia, Kent, Montauk, OM Same as Momentum Native /* Nav item color */ #navBlock ul li a { color: #ff0000 !important; } /* Nav item hover color */ #navBlock ul li a:hover { color: violet !important; } /* Nav item active color */ #navBlock ul li.active-link a { color: green !important; } Pacific: Bryler, Charlotte, Fulton, Horizon, Naomi, Pacific /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Skye: Foundry, Indigo, Ready, Skye, Tudor /* Nav item color */ .nav-blocks-wrapper div a span { color: #ff0000; } /* Nav item hover color */ .nav-blocks-wrapper div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.nav-link--active a { color: green !important; } Tremont: Camino, Carson, Henson, Tremont /* Nav item color */ #mainNavigation div a span { color: #ff0000; } /* Nav item hover color */ #mainNavigation div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.active a span { color: green; } Wells /* Nav item color */ div#topNav ul li a { color: #ff0000 !important; } /* Nav item hover color */ div#topNav ul li a:hover { color: violet !important; } /* Nav item active color */ div#topNav ul li.active-link a { color: green !important; } Wexley /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } York: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, Taylor, York /* Nav item color */ .site-navigation div a span { color: #ff0000; } /* Nav item hover color */ .site-navigation div a:hover span { color: violet; } /* Nav item active colo */ .site-navigation div.active a span { color: green; } Squarespace 7.1 /* Nav item color */ .header-nav-item a { color: #ff0000 !important; } /* Nav item hover color */ .header-nav-item a:hover { color: violet !important; } /* Nav item active color */ .header-nav-item--active a { color: green !important; } Created by Tuan Phan. Share to be shared more.
  5. Hi guys! I want to add a Canadian/U.S Flag toggle to my top navigation bar and figured out how to do it, except my drop down folder is getting an overlay from my second navigation bar. Any ideas how to fix this? I've attached a photo below. The website URL is https://penguin-roadrunner-4c8m.squarespace.com/ Password: Skyfall77
  6. I'd like one of the multi-word page titles in my nav bar to stack one word on top of the other so it does not take up so much horizontal room on the bar. I am using Avenue template. The site as it currently stands can be found here: https://www.amberdkempthorn.com/ I'd like "Older Work" to be aligned so that "work" displays under "older." I may add additional pages in the future that I'd also like to apply this feature to. Any assistance or suggestions would be greatly appreciated!
  7. Hi all, Does anyone happen to have some CSS for targeting ONLY links within navigation (for both mobile and desktop)? By links I am meaning explicitly items in the navigation that are listed as Links from the 'Other' section of the 'Create a new page' pop up when adding a new page to the navigation. I am looking to target the styling of only those links, not pages or folders, when shown in the navigation. Ideally in a different font and/or colour. Any assistance much appreciated 🙂 (I am unable to share a link to the site for the time being, apologies) Sarah
  8. Hi all! We have a client who as asked us to add images to their navigation that would be a link to interior pages. I am guessing the images would have some sort of hover over functionality as well to show it is a clickable link. I am attaching a super rough mockup to show you what they want, items such as where the logo will go and the Contact button will need to be adjusted but this is the simply gist of what they want. I have NO idea if this is an option and know that if it is (woo hoo!) then we also need to create something custom for mobile. Any suggestions you have would be so helpful, we have not promised anything to the client yet so if this is not a possibility, that is okay yet I can see where knowing how to create something like this might be nice for my dynamic menus like we were used to in the olden days of Wordpress. Site link is: https://trombone-paddlefish-tj7b.squarespace.com/ pw: cinderwood2019 Thanks!
  9. So I'm using the Foster template for www.supermoonbeautyco.com, and the shopping cart is in the upper right corner on desktop view. It is also in the upper right on horizontal mobile view. However, when a mobile device is vertical (how most of my customers are shopping) the cart disappears completely in favor of the default condensed navigation menu. There is no where to access the shopping cart anywhere in mobile view, when vertical. Can anyone walk me through how to override this? I've searched every setting possible in my pages, styles, etc. And there's just nothing. This is wild to me that this is how the template itself is set up.
  10. Hello guys, I am using Brine template and I have setup a nice cover page with a background video. I was wondering if anyone can help me with moving the navigation text which is centred on the screen slightly lower? As you can see here: https://gyazo.com/a15c61e834b0bc6e65bea65e4f597fb8 The 'English' & 'Spanish' navigation links are in the way of the background logo - Has anyone got the CSS id to move this navigation down slightly lower? I am struggling to target the right parts. Any help appreciated! I am using the 'Cover' template for the Cover page on Brine.
  11. Hey all! I'm totally new to squarespace and I'm trying to set up a fairly simple photography website and wanted to have everything on one scrolling page. I have the index page all set up but I can't figure out how to get the navigation bar to link to sections of the index page. For example, I can only get a link to the "About" page to show up in the navigation bar if it's a separate page. If I move the About page to a section in the index page it disappears from the navigation bar. Is there a way to get sections of the index page to show up in the navigation bar, so I can set it up to scroll down to the About section by clicking it in the bar? Thanks in advance for the help!
  12. I am trying to figure out why one of my codes isn't working. It's the last few lines, which is supposed to make a gradient background in mobile nav menu. I know it's a lot of code. But, can someone look at it and tell me if anything is wrong? Thanks! .image-block { -webkit-filter: drop-shadow( 5px 5px 8px #000000 ); filter: drop-shadow( 20px 15px 10px #000000 ); } // Announcement Bar Hover Color // .sqs-announcement-bar { width: 100%; background-color: #ff0000 !important; /* main color */ webkit-transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; -ms-transition: all .25s ease-in-out; -o-transition: all .25s ease-in-out; transition: all .25s ease-in-out; } .sqs-announcement-bar:hover { border-color: white !important; background-color: #6bae23 !important; /* hover color */ webkit-transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; -ms-transition: all .25s ease-in-out; -o-transition: all .25s ease-in-out; transition: all .25s ease-in-out; } // Bounce Social Icons // @-webkit-keyframes hvr-pop { 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } } @keyframes hvr-pop { 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } } .sqs-block-socialaccountlinks-v2 a svg{ top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .sqs-block-socialaccountlinks-v2 a{ -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); } .sqs-block-socialaccountlinks-v2 a:hover{ -webkit-animation-name: hvr-pop; animation-name: hvr-pop; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; } .social-icons-style-regular .sqs-use--icon{ fill: #000000 !important; } .social-icons-style-regular .sqs-svg-icon--wrapper:hover .sqs-use--icon{ fill: #FECB2F !important; } // Newsletter Block // .newsletter-block { padding: 50px !important; border-radius: 25px; background-color: #272732; } // Gradient Newsletter Block // .newsletter-block { background: linear-gradient(to bottom, #c0c0c0, #000000); padding: 50px !important; border-radius: 20px; } // Animation Keyframes // @-webkit-keyframes Gradient { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @-moz-keyframes Gradient { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @keyframes Gradient { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } // Animated Gradient Audio Player // .sqs-widgets-audio-player { background-image: linear-gradient(-45deg, #ffffff, #ff0000, #000000, #F07C63) !important; background-size: 400% !important; -webkit-animation: Gradient 10s ease infinite !important; -moz-animation: Gradient 10s ease infinite !important; animation: Gradient 10s ease infinite !important; border-radius: 5px; } // Highlighted Field Form // .field-list .field-element:focus, .field-element:visited{ border-color: #FECB2F !important; } .field-list select:focus{ outline-color: #FECB2F !important; } .field-list .section{ border-color: #FECB2F !important; } .form-button-wrapper .button{ color: white !important; border-color: transparent; background-color: #fecb2f; } .form-button-wrapper .button:hover{ color: white !important; background-color: #000000 !important; } // Leaflet Contact Form Button // .form-wrapper input[type=submit] { border-radius: 50px 0px 50px 0px !important; padding: 30px; } .form-wrapper .field-list .field .field-element{ border:none; border-bottom: 3px solid; border-color: #ff0000; background: #ffffff } // Animation Keyframes // @-webkit-keyframes Gradient { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @-moz-keyframes Gradient { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } @keyframes Gradient { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } // Footer Top Border // Footer { border-top: 5px solid #ff0000; } // Rotating Animation Keys // @-webkit-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -webkit-transform: translateY(-30px); } 5% { opacity: 1; -webkit-transform: translateY(0px);} 17% { opacity: 1; -webkit-transform: translateY(0px); } 20% { opacity: 0; -webkit-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-moz-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -moz-transform: translateY(-30px); } 5% { opacity: 1; -moz-transform: translateY(0px);} 17% { opacity: 1; -moz-transform: translateY(0px); } 20% { opacity: 0; -moz-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-o-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -o-transform: translateY(-30px); } 5% { opacity: 1; -o-transform: translateY(0px);} 17% { opacity: 1; -o-transform: translateY(0px); } 20% { opacity: 0; -o-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @-ms-keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; -ms-transform: translateY(-30px); } 5% { opacity: 1; -ms-transform: translateY(0px);} 17% { opacity: 1; -ms-transform: translateY(0px); } 20% { opacity: 0; -ms-transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @keyframes rotateWord { 0% { opacity: 0; } 2% { opacity: 0; transform: translateY(-30px); } 5% { opacity: 1; transform: translateY(0px);} 17% { opacity: 1; transform: translateY(0px); } 20% { opacity: 0; transform: translateY(30px); } 80% { opacity: 0; } 100% { opacity: 0; } } @media only screen and (max-width: 640px) { h1 { font-size: 20px !important; }} @media only screen and (max-width: 640px) { h2 { font-size: 20px !important; }} @media only screen and (max-width: 640px) { h3 { font-size: 20px !important; }} @media only screen and (max-width: 640px) { p { font-size: 11px !important; }} //remove hyphens// p, h1, h2, h3 { -webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; } .sqs-search-page { .sqs-post-type-image.ContentItem { display:none !important; } } .image-slide-title { white-space: normal !important; line-height: 1.5em; } @media screen and (max-width: 640px){ .sqs-gallery-design-grid-slide{ width: 100% !important; } } @media only screen and (max-width: 768px) { b { font-size: 20px; } } @media only screen and (max-width: 320px) { b { font-size: 10px; } } @media screen and (max-width: 960px) { h1 { font-size: 41px; } h2 { font-size: 33px; } h3 { font-size: 20px; } } /*Reducing font size for screens smaller than 960px*/ @media screen and (max-width: 960px) { h1 { font-size: 41px; } h2 { font-size: 33px; } h3 { font-size: 20px; } } /*Reducing font size for screens smaller than 640px*/ @media screen and (max-width: 640px) { h1 { font-size: 33px; } h2 { font-size: 20px; } h3 { font-size: 16px; } } // Bold Text Color // h1 strong { color: #32cd32; font-weight: bold; } // Custom Color Social Icons // .sqs-use--icon { fill: #E77D6A !important; } // Slightly Angled Text // h1 { transform: skewY(-5deg); } // Pill Audio Block // .sqs-widgets-audio-player { border: 1px solid transparent; padding: 5px; border-radius: 50px; } .Header--top { background-image: url(https://static1.squarespace.com/static/5d4c573da7991a00018356bc/t/5dd5ef4cd168ef7c6a901a6b/1574301516774/Untitled+design.jpg); background-size: cover; background-position: center center; } // Center Footer Text // @media only screen and (max-width: 640px) { footer { text-align: center;} } @media screen and (max-width: 800px) { .sqs-block-image .design-layout-card:not(.sqs-narrow-width) { display: block!important; } .sqs-block-image .design-layout-card:not(.sqs-narrow-width) .image-card-wrapper { width: 100%; } .sqs-block-image .design-layout-card:not(.sqs-narrow-width)>div:first-child { width: 100%; } } @media only screen and (max-width: 640px) {h1 {font-size: 70px;}} @media screen and (max-width: 640px) {.Index-page-content h1 {font-size: 70px; }} @media screen and (max-width: 640px) {h1 { font-size: 70px; letter-spacing: 5px; line-height:60px; color:white;}} .site-title img { max-height: 100px; max-width: 400px; } // Slide In Bounce Button - Left To Right // .sqs-block-button-element--small:hover{ color: #000000; } .sqs-block-button-element--small:hover:before, .sqs-block-button-element--small:focus:before, .sqs-block-button-element--small:active:before { -webkit-transform: scaleY(1); transform: scaleY(1); -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); } .sqs-block-button-element--small:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #FECB2F; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .sqs-block-button-element--small { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .sqs-block-button-element--small { margin: .4em; padding: 1em; cursor: pointer; text-decoration: none; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } // Mobile Menu Background // .header-menu-bg { background-color: #ffffff; background: linear-gradient(to bottom, #6b8e23, #000000); } // Mobile Menu Text // .header-menu-nav-item a { color: #FFFFFF !important; } // Mobile Menu Background // .header-menu-bg { background-color: #000000; background: linear-gradient(to bottom, #F07C63, #E45372); } // Mobile Menu Text // .header-menu-nav-item a { color: #FFFFFF !important; }
  13. I have a little bit of an odd problem with anchor links and mobile navigation in the new 7.1 template. I'm creating a single page website for a client (unfortunately I cannot yet share the website) and have created anchor links in the main navigation so users can quickly scroll to sections of the page. I've done this by setting the links as "#AboutUs" for example, and creating an empty div with the id "AboutUs" where I want the page to scroll to. In the desktop layout this works as intended, but on mobile when a navigation link is clicked the full-screen navigation menu remains open. The user is then completely unaware that the link has worked as it looks like nothing has happened, when in fact behind the full-screen navigation menu the page actually has scrolled to the correct point on the page. I've tested this in a live 7.0 site and it works as intended (open mobile navigation > click on anchor link > mobile navigation closes and page scrolls to the relevant id) but not in 7.1. I've also noticed that the page no longer smoothly scrolls when clicking an anchor link like it did before, but this is a minor issue compared to the above, so it doesn't bother me too much. TL;DR In 7.1, is there a way to force the mobile navigation menu to close when an anchor link is clicked?
  14. Hello, I really appreciate some help, I have to hide the "home", "our story" and "meet our adivsors" links from the header menu. Website: https://www.windfallnatural.co.uk/home Thank you in advance.
  15. Hi, I'm using the Harris template and I want to know if there is a way to stack my secondary nav items on top of each other aligned left. Rather than showing inline. I have tried adding <br> into the secondary nav items but it does not separate the three.
  16. Trying to change one of the Navigation Text to a different color. Currently, all of Navigation Titles are Black but I'd like the "Request Appointment" Title to be Red. I've been looking all over and can't find the code to put in Ishimoto Template. Here's my site link: https://www.losaltoseyecare.com/home Here's the tab I want Red on the Navigation: https://www.losaltoseyecare.com/request-appointment
  17. Hi there, website is belvederebc.com, I'm trying to change the font colors of each link in "communities" subnav, first one (Residences at Belvedere) to #a00101 (red) second to #29a5a5 third to #2e8c2e fourth to #e65c00 Any help (even just some) would be greatly appreciated. Thanks!
  18. I am currently using the Blend Template and have questions regarding the header and navigation. I have a placed a folder in the primary navigation menu with (6-7 pages) that drop down. 1. The hamburger icon is a navigation option in mobile, but what code do I need to make it appear when viewing from a desktop? 2. How do I prevent the drop down pages from flowing off the screen? 3. When I click the hamburger icon in mobile, you have to click the folder to get to the pages. How do I bypass that so it is just one step to view the pages?
  19. Hello! I'm using the Skye template and was wondering if I could change the link you get taken to when you click on the navigation title? Etizaz 🙂
  20. Hello, I would like to underline each individual menu item when you hover over it. What CSS would I use to do this? I may also want to keep it underlined when that page is active. Please could you pass on the CSS for this also. Thanks, Liv https://greyhound-keyboard-sa3k.squarespace.com/
  21. Hello I'm looking to make secondly navigation text link visible when viewed on a mobile device. I've had a look through previous posts for guidance, to no avail, and hoping someone can offer assistance, point me in the right direction or offer alternatives. The link is to be pointed towards a contact page instead of the mobile accordion. Template is Brine. Many thanks, Callum
  22. Hey, I was wondering if anyone could provide the CSS to decrease the spacing between the site navigation headers and their related drop downs (See attached image, space to be decreased is signified with yellow arrow) Thanks community!
  23. Does anyone know how I can put white dividers (ie: |) between navigation links? The url to my website is trentnader.com. Thanks in advance!
  24. I am using some simple custom CSS to control the color of the Nav links. It works perfectly in the editor -- but not with the site. I emptied the cache., etc... to no avail. The site Nav would not display the "Donate" text in white. Am I missing something? /* donate nav link */ #main-navigation li:nth-of-type(6) a:link { color: #FFFFFF !important; text-decoration: none; text-align: center; margin-left: 30px; margin-right: 30px; padding: 14px 20px !important; border: 1px hidden white; -webkit-border-radius: 10px; -moz-border-radius: 1opx; border-radius: 10px; background-color: #FF7D41; -webkit-transition-duration: 0.4s; /* Safari */ transition-duration: 0.4s; display: inline-block; } #main-navigation li:nth-of-type(6) a:hover, a:active { background-color: rgba(255, 246, 249, 0.9); color: #FF7D41 !important; text-decoration: none; text-align: center; font-weight: bold; display: inline-block; }
  25. Hi, I created my site and I was optimally hoping to have my main nav links all line up at the top of my website directly above the wide image in the header. The template I have only offers options to place the nav links on the left or right at the top, which I was okay with, since I have 6 links total, 3 on each side of my logo. When I publish the site though and view it on a laptop, the very first top left link and the second left nav link end up on the same line. It looks life an error when published. Can you help me correct this? Ideally I'd love the first scenario I described where all the links are lined up across the top horizontally centered or flush right. If that's not possible, I'd love to at least get the top two nav links to not be on the same line and to instead sit on their own lines as they do in my desktop and tablet design preview. Thanks for your help,
×
×
  • Create New...