durocketuk

For a reason unclear to me, this was solved when I made the navigation bar position relative to move it below image header (see my other question).

.navigation-top {
	   position: relative;
}

Benjamin

Dear all,

I solved this with this piece of code :

.navigation-top {
	   position: relative;
}

Benjamin

It does, thank you for the support !

Andrew,

Fantastic, it works !

Could you please give a hint into what happens ?

I had to set the position of the image title to relative because I use a css trick to overlay the image title over the image on mouse hover :

.collection-img .so-widget-sow-image .widget-title {
	position: relative;
	transform: translateY(-300px);

If position is set to absolute, then the title spanned the whole page.

Now setting the parent div position to relative solve the problem, but I admit I have no clue why…

Many thanks for your help !!

• This reply was modified 6 years, 5 months ago by durocketuk.

Hello,

Thank you for answer !

It works, but isn’t this kind of a hack ? I have the widget title displayed over the image on hover, and obviously setting font-size of the parent element to 0 hides it.

Actually I don’t understand why displaying the title causes this margin around the widget.

Dear emranemranx,

Thank you very much for your help.

However, your selector modifies the position of the first degree dropdown menu, whereas I want to align the second degree menu (the list in Carnets autour du monde > Russie) to the right of the first degree dropdown menu (Carnets autour du monde). At present, when hovering on Carnets autour du monde > Russie, the list of posts is positioned relative to the menu item (Russie) and therefore occludes the rest of the menu. I want to position the left edge of the second degree dropdown menu to the right edge of the first degree dropdown menu.

I hope this is clearer.

Many thanks in advance,

Benjamin

Thank you Denzel,

But what if I want to my tagline underneath my logo in non sticky mode, but not displayed in sticky mode ?

I can’t find any documentation on how to customize the CSS of the modern version of the theme (all the published snippets are valid only for the classical version). Am I missing something ? Why have all the selectors being changed (this question may sound stupid, I am obviously not a web developper).

Thanks,

Hello,

I am designing a new website and I want to take advantage of the Modern style of Customizr.

I also want to modify the credit lines in the footer, and as you suggested I have overridden the footer templates by placing the path to my new templates in my child theme.

But is this really best practice ? If future updates of Customizr modify the footer templates, it will be difficult to track them down.

Why can’t we use a hook like in the classical version ?

Thank you in advance for your input,

• This reply was modified 7 years, 3 months ago by durocketuk.
• This reply was modified 7 years, 3 months ago by durocketuk.
• This reply was modified 7 years, 3 months ago by durocketuk.

Solved it by applying my CSS style to the widget and not to every elements of the footer… Very basic.

I have sorted it out eventually.

The too large header was caused by a big left padding (dirty practice to center a content) on my right footer widget causing the elements to exceed the footer boundaries and thus creating this weird shift.

I tried to investigate a bit the issue.

Turns out that my issue is independent of the snippet to display full-width main content of pages.

The header simply has a wrong size : it is too wide, wider than the main wrapper.

What is causing this ?

Many thanks in advance,

Benjamin

• This reply was modified 7 years, 11 months ago by durocketuk.

Thank you for your very fast answer, and apologies for failing to follow up, I’ve been without the internet for weeks.

Hereafter is the problematic css snippet I use to style the text of the third footer widget.

/* Style the widget text */
footer#footer a {
font-size: 14px;
margin: 30%;
}

It also increases fontsize of the footer credit, hence destructuring the line. I guess I need to apply the formating to the 3rd widget only, and not the whole footer.

Yes, thanks,

Benjamin

Thank you Menaka,

Following your adice, I included an ID in the php code to be able to style it independently.

Fantastic, it works !!!

So I understand that there are some inline property in the code I used to create the custom widgets, that I need to overide with the !important argument ?