Jump to content

Menu and language flags in one row: how to put flags on a following row?


Milada

Recommended Posts

Dear team,


I have a site layou like this now: menu and language flags are in one same line/row. I only need to put the flags under the menu, centered.

As if I clicked the Enter button in front of the first flag and put them all on a following row.

Can you please tell me what is the code for that?

Where should I paste it?

Thank you in advance.

Milada

Link to comment
Share on other sites

THIS BUGGY FORUM NO LONGER ALLOWS margin-left: IN code box OR AS PLAIN TEXT

 

/*flags centred below text */
.lang-item img {
bottom: 7px;
left: 50%;
m@rgin-left: -8px;
position: absolute;
}

 

 

OR

 

/*flags centred above text */

.lang-item img {
left: 50%;
m@rgin-left: -8px;

position: absolute;
top: 7px;
}

 

NOTE: because forum is becoming like IE of the past I had to use '@' instead of 'a' in margin for it to be accepted

 

Paste it in your themes css file below current css, but! ABOVE any media queries.

Edited by dsonesuk
Link to comment
Share on other sites

I have put it firstly before this command: /* # Media Queries

---------------------------------------------------------------------------------------------------- */
it did not work
then I put it before: @media only screen and (max-width: 1340px) {
it did not work either
I chose one of these two as you said any...
Replace "@" with an "a" of course
I do not know anymore what is wrong
Link to comment
Share on other sites

dsonesuk, I am glad that you try to help. I understand that I will put tag:

<ol>

<li>Coffee</li>

<li>Tea</li>

<li>Milk</li>

</ol>

 

<ul>

<li>Coffee</li>

<li>Tea</li>

<li>Milk</li>

</ul>

 

in front of Elemis. But in which file? I tried both functions.php and style.css, but there is no mention of "Elemis". Where should I paste it?

Thank you in advance.

Link to comment
Share on other sites

????? its part of the menu? you must have added 'Elamis' as a menu link and url, well then add a blank menu after 'Elamis' at same indentation level and give it a custom class name. Also it won't be a ol but a li element, it will contain empty link to http://moreyouthfulskin.com/en/# use ' ' as title name.

Edited by dsonesuk
Link to comment
Share on other sites

IT NOT pasted in anywhere, you log in to wordpress backend, go to appearance -> menu this is where all your current menu item links should have been created, All you are doing is adding a blank menu list to use as separator, IT will create this all you have to is click create custom menu link, fill in required details save, and this new menu will appear.

Link to comment
Share on other sites

I created a new menu called Flags - is it what you mean? How do I add this menu under the main menu (which is assigned to After header menu)?

Further I deleted both

/*flags centred below text */
.lang-item img {
bottom: 7px;
left: 50%;
m@rgin-left: -8px;
position: absolute;
}

AND

/*flags centred above text */

.lang-item img {
left: 50%;
m@rgin-left: -8px;

position: absolute;
top: 7px;
}

but now the menu is left - as the space designed for flags occupies the center.

What should I do?

Link to comment
Share on other sites

YOU add new menu and use as separator, you use the custom class name to give it a style such as as display: list-item; this will cause the flags to be on a row below it giving you two rows, row 1 will have Home, Care, Recipes, Elemis, row 2 will be the flags, you then style the parent container to centre both rows using text-align: center; because the list-item use display: inline-block which makes these element act as though they are text and centre themselves.

Link to comment
Share on other sites

I really am not an IT, my profession has nothing to do with IT. I would like to ask you a favour: could you please simply write me SIMPLE steps on how to proceed? Now I created a new menu, called flags, which contains a Language switcher. How should I proceed afterwards?

Thank you in advance for writing me a simple step by step instruction, which I would only MECHANICALLY follow.

Link to comment
Share on other sites

I can't! I don't if your wordpress is using default menu creation, or some other plugin, I can't know what it will! or will not! accept to creat a blank separator menu option, if it allows custom classes, what classes it uses by default. You need to read up documentation on default creating menu, or possibly used menu plugin, and also creating menu separators preferably from WordPress forum. In fact anything relating to WordPress functionality should be asked in a WordPress related forum, anything in regards to css presentation can be asked here.

Link to comment
Share on other sites

I will repeat myself but as I am newbie not knowing anything about IT, I cannot judge if I should ask on a css forum or php forum or another forum.

Can you please remedy the issue concerning centering? It suddenly does not work after I pasted your codes into my cPanel files.

How do I remedy this?

Link to comment
Share on other sites

Create an account or sign in to comment

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

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...