Hi Andy,

I think there might be an issue with my quick css code, i’m determined to figure this sucker out! Is any of this quick css code conflicting?

Hers is what I have in my code to center it

.av-main-nav li:nth-child(3) {
    margin-right: 20vw;
}

.av-main-nav li:nth-child(4) {
   margin-left: 5vw;
}

.container.av-logo-container {
    top: 25px;
}

Here is the screenshot of what that looks like (see below)

Here is the quick css code you gave me The first block is what make the logo not centered.

.html_header_top.html_logo_center .logo {
top: -10px;
left: -4px;
height: 77px;
}

@media only screen and (max-width: 1100px) { 
.html_header_top.html_logo_center .logo {
top: -10px;
left: -4px;
height: 77px;
}}

See Second screenshot

First off is there any conflicting code? Second is there a way to just increase the logo area? When I enter this quick css code things get weird I noticed. Is there way to just increase the logo box? possibly by changing the quick css code or making the logo box larger?

When I add this code below is when things do not stay centered. Is there something I can add in here to make that happen. Right now it is all the way to the left. If I chane the left to about 300 it will go center but it does not adjust when I minimize the browser and overlaps the menu.

.html_header_top.html_logo_center .logo {
top: -10px;
left: -4px;
height: 77px;
}

Thanks for helping me with this! Let me know, like always I plan on rating you high for every license I purchase :)

Hallo Andy,

wenn du mit dem Desktop-PC ganz oben auf der Startseite bist, siehst du im Hauptmenü ‘Kontakt’ farbig hinterlegt (grün, wie bei mouseover), obwohl du weder mit der Maus drauf bist, noch dich auf der Startseite in der Sektion ‘Kontakt’ befindest!

Verstehst du?

Vielen Dank vorab.

Gruß,

Matthias

i tried a few more times. every time i move from staging to live EVERYTHING is messed up. all the media queries stop working and you see double of everything.

i forgot a {} . it works :)

@media only screen and (max-width: 767px){
.responsive #top #main {
padding-top: 88px !important;
margin: 0;}}

@media only screen and (max-width: 767px){
.responsive #top #wrap_all #header {
position: fixed !Important;
width: 100%;
float: none;
height: auto;
margin: 0 !important;
opacity: 1;
}}

I figured it out. i think. hopefully it won’t ruin anything.

i changed the header to fixed and then the container below it to:

@media only screen and (max-width: 767px)
.responsive #top #main {
padding-top: 88px !important;
margin: 0;

the padding was moved to 0.

If i change the position from relative to fixed, it fixes it but then the container underneath it is covered

@media only screen and (max-width: 767px)
.responsive #top #wrap_all #header {
position: fixed;

@chios, like I said, I have same problem with enfold 3.7.1. They have close topic in the link that you have share on WPML support without find solution. I notice that this problem only concerns enfold themes.

• This reply was modified 9 years, 2 months ago by kouamx100.

Hi Vinay,

I followed your instructions and installed a fresh copy of Enfold.

• When I active Enfold main theme the links of the two items work as they should: title and icon open in a new window and (of course) there is no link on the icon box itself.
• When I activate the child theme, the two items no longer link correctly. They open as I explained above.

As long as I had these icon boxes in the content of the website, they worked well, but since I put them in the footer, they don’t work well anymore.

I wonder if perhaps footer settings could have this impact? Or is it the css I added (and which I had to change to be used for the footer) which is not correct? Fyi the css code below.

Thanks & regards,
Monique

#footer .textwidget .icon-box-height {
	min-height: 230px;
	border-radius: 4px!important;
	box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.3);
	background-color: #f0f0f0;
	margin-top: 30px;
}

#footer .textwidget .icon-box-height .iconbox,
#footer .textwidget .icon-box-height .iconbox_top,
#footer .textwidget .icon-box-height .iconbox_content {
	margin-top: -1px!important;
	border: 0!important;
	background:transparent!important;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0)!important;
}

#footer .textwidget .icon-box-height {
    cursor: pointer; /* hele icon box link maken */
}

#footer .textwidget .icon-box-height:hover {
	background-color: #e6e6e6;
}

#footer .textwidget .iconbox_top .iconbox_content {
    padding: 45px 10px 10px; /* smallere padding links en rechts */
}

#footer .textwidget h3.iconbox_content_title a {
	font-size: 26px;
}

#footer .textwidget .iconbox_content_container p {
	font-size: 12px;
}

I see it in the top left area of the scree, it happen only on Chrome, can you help me?