Archived topic
Adding left hand text to right hand second navigation
8 replies · Started by Debbie on December 23, 2021
Hallo
Not sure how to achieve this. I have a secondary navigation at the very top of the website and all the menu items are justified to the right of the screen, which is where I want them. On the same line, but at the other end of the screen (justified to the left), I'd like to add some text.
I've added the text using a hook (generate_inside_secondary_navigation), but this appears in the middle of the screen.
So I've added a div class to this text like so -
.
And added this CSS to the customise, additional CSS like so -
.talk {text-align: right;
size: 13px;}
But this doesn't work. Am I missing something?!
It's going to be difficult to add screenshots as this is something I'm working on locally, so nothing live yet.
Sorry if this is a simple question, but I'm a bit of a newbie to this and I'm making it up as I go along! :)
Thanks
Sorry, the div class didn't come out properly in the original query above. Here it is -
<div class="talk">Talk to us about your project - 0000 000 000</div>
Not sure what I'm doing wrong here, but don't seem to be able to add the html - it seems to be stripped out whenever I try?
Hi there,
is it possible to see the site ?
NOTE: in the forum, to display code, you must highlight the code, and click the code button before subimitting. I edited the above reply so you can see it now :)
Hallo David - sorry for not getting back sooner - been manic at work since I got back this year! I've included a link to a folder where I've stored the images. Capture.png is what the header looks like at the moment - the highlighted text needs to be at the left hand side of the header and a smaller size to match the secondary menu on the right hand side (which looks fine and is exactly where I want it to be). I've also included a screenshot of the hook code and the additional css that I've added.
Is that clearer? Let me know if you need anything else.
Thanks - Debbie
OK - so Text alignment applies to the content within the container. Not the actual container eg. div.text
In order to align the div.text i need to know what its sits inside of.
Could your right click > inspect the div.text and share a screenshot of the developers tools > elements tab so i can see div.text and its surrounding HTML?
Ah - I've added the text as a hook element 'generate_inside_secondary_navigation', so as I understand it, the text is being added to within the menu itself, hence the positioning? I should be adding to the menu bar instead? I've added a link, so that you see what's coming up in the elements tab.
I have a feeling I've done this completely incorrectly!! :) - could you point me in the correct direction?! Thanks David - much appreciated.
Try this CSS:
.secondary-navigation .talk {
order: -1;
margin-right: auto;
}Brilliant!! That worked a treat - thanks David
Glad to hear that!
