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

Recommended Posts

Posted (edited)

Hey, I'm building my site in 7.1 (mainly to get to grips with using it) and I've come across one problem I can't seem to fix.

The dropdown navigation has white text & a white background(image attached)

My header colour palette is yellow, whereas the main website has a white background, I'm wondering if this is part of the problem.

It'd be greatly appreciated if anyone can find any workaround for me.

Site is here: https://hexaflexagon-star-bh8p.squarespace.comPasword: 123123

screenshot-2019-07-29-at-114717.png.7a2855cc3564f2c638d024dd84c72db8.png

Edited by StephenWise1999
Initial Revision

Share this post


Link to post

@StephenWise1999 Add to Home > Design > Custom CSS


/* Change dropdown menu background */
.header-nav-folder-content {
   background: #febf00 !important;
}


Share this post


Link to post

That worked perfectly, I'd tried a variation of .header-nav but didn't manage to get it right. Thank you!

Share this post


Link to post

DeaTuznphan,

do you have a way to make the width of the drop down wider according to the width of the text?

Thanks,

G

Share this post


Link to post
53 minutes ago, gcart said:

DeaTuznphan,

do you have a way to make the width of the drop down wider according to the width of the text?

Thanks,

G

Yes. You can use custom code to increase dropdown width. Can you share link to your site, i can take a look?

Share this post


Link to post

@tuanphan

Thank you so much!!  I needed to edit the drop down folder links color to black and I used your code as guidance.

So I'm guessing that putting:  !important   tells Squarespace to notice it.

/* Change dropdown menu background & link color :) */
.header-nav-folder-content {
   background: #ffffff !important;
  color: #000000 !important;
  
  a {
  color: #000000 !important;
}
}

 

Share this post


Link to post
16 minutes ago, Supdude said:

@tuanphan

Thank you so much!!  I needed to edit the drop down folder links color to black and I used your code as guidance.

So I'm guessing that putting:  !important   tells Squarespace to notice it.

/* Change dropdown menu background & link color :) */
.header-nav-folder-content {
   background: #ffffff !important;
  color: #000000 !important;
  
  a {
  color: #000000 !important;
}
}

 

Have you solved yet?

An element can be affected by many CSS. Use important to give your CSS the highest priority.

Share this post


Link to post

Dear Tuanphan,

That is big help. But now all the text pushed to the right as on the attached screen shot.
I may be able to correct this in the design section but since I’m using CSS I’d like to do all that in the CSS.

And I’d like the dropdown menu to size according to the text. Now the text moves down when it hits the edge of the box.

I really appreciate your help.

Sincerely,
George Cartwright

Screen Shot 2019-12-11 at 9.53.53 AM.png

Share this post


Link to post

@gcart

All the code above only affects color and background. Your problem, I think it came from another cause.

You can create a new question, and describe the problem in detail.

Share this post


Link to post

... I went ahead and found out how to change the text and make it all line up to the left.
Here’s a screen show of how I did it.
And I got a little transparency which I like.
Best,

George
 

screen shot of how to change layout and text alinement.jpg

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...