Cirnu

Thanks, it works !

I just added the code to the CSS dedicated to this template, in order to preserve the other pages !

.page-template-full-width-php #main-wrapper {
	width: 100%;
        overflow-x: hidden;
        padding-left: 0px;
        padding-right: 0px;
	}

Thanks again !

Regards

so, nobody for an solution, or an idea ?
where could this phenomenon come from ?
maybe I shall do something with a media query ?

ooops sorry, thanks !

anyone’s got any idea plz ?

I fortunately have only template : the full-width one !
I put it in PHP tags but I can assure you it gave a blank page if put in my template, but a nice result if put in my child theme (in the functions.php file).

You’re right : now I added content and there is no big space anymore. Thanks again for your help ??

Hi,

thanks, I added this code to the .php template file but now my link displays a blank page…
But when I put it in the child theme functions.php file, it dit the trick ! Thanks a lot ??

A small problem still remains : when my browser is in in full width mode, there is a big blank space (bigger than usual) than usual under the colophon. And when I put the browser in full screen mode (F11), this space becomes even bigger. Where does this may come from ?

Regards

Hi,
I don’t know if I’d better open a new topic or stay on this one. Please forgive me if I’m mistaken.

I had the same problem as exposed here, and I used the solution proposed.

However, I have some issues with the responsiveness : the footer widget is not center but slightly left-aligned, when I change the page width it does not move “continously” but seems to follow “steps”. Moreover, the space below my footer (colophon) has greatly increased (5x times).

Does anyone experienced the same issues ?

Thanks

Hi,
thanks again for your help, I would never have reached my goal without you.

I’ve found a solution for the big white gap around the menu, I’ve changed a bit the code you gave me, it seems to work :

@media screen and (max-width: 1200px) {
	body.responsive header#masthead .hgroup .logo {
		float: none;
	}

	body.responsive header#masthead .hgroup .logo img {
		margin: 0 auto;
		display: block;
	}

	header#masthead .hgroup #header-sidebar {
		/*border: 1px solid black;*/
		position: relative;
		text-align: center;
		width: 100%;
	}

	header#masthead .hgroup #header-sidebar:after {
		content: '';
		display: table;
		clear: both;
	}

	body.responsive header#masthead .hgroup #header-sidebar .widget {
		display: inline-block;
	}

	header#masthead .hgroup #header-sidebar aside.widget:after {
		content: '';
		display: table;
		clear: both;
	}

	.menu li {
		float: none;
	}
}

Here is what I mean by “the logo is aligned left for intermediate values between 1200 and 680”:

https://imgur.com/hMxqqy3

Regards

For the slider, I think it depends on the browser used and the OS. With Chrome 40.0.2214.115 m, when resizing the scree several times, my Vista laptop shows a cut off slider, whereas my Win 8 laptop does not. Just forget about it, it is not really important.

About the menu :

– with FF 35.0.1, Chrome 40.0.2214.115 m and IE 11, the menu does not come across the logo and goes below properly, as soon the max width is reached. Actually, I’ve set my media query max-width to 1200. Between 1200 and 680, the logo is left-aligned. Then, below 680, the logo is centered, as it is displayed on your picture. I have this result with those 3 browsers. If you make your window’s width be between 1200 and 680 ans you’ll see what I mean. How should I center the logo for those “intermediate” values ? And, when the menu is stacked, how can I center it too ? Thanks

I still have a bug with IE 9 on a Vista x86 laptop , the logo remains covered by the menu when I decrease the width, as if there was’t any media query.

It’s ok for the logo-blur problem, I solved it ??

Only the two last problems remain.

Hi,
thanks a lot, it works great now ! We’re almost done ?? ?? ??

My logo seems to be resized (a little bit bigger than the original image), it displays blured : the edges are not sharp. How could it be solved ?

After reducing then increasing the width of my window, the slider is cut in its lower part. Does it come from our CSS ?

I’ve seen that the logo class was “logo”, how can it be centered in the media query ?
I’ve tried :

body.responsive header#masthead hgroup .logo img {
     margin-left: auto;
     margin-right: auto;
	}
}

(and also without “img”) but I can’t manage to select it

Again, thanks a lot for your time and your help

Hi

Yes thanks I’ve just added them then deleted them ! I was doing PHP before :/ I’m tired …

I removed the <style> tags toot And thanks a lot, my font displays properly on chrome and IE now !

The only remaining problem is the following one : when I reduce the page size, let’s say below 1100 px, the text, the slider and the menu begin to go left If I reduce again the width, the size of the slider and the text is reduced, but my menu begins to go across the logo.

And finally, when width reach 680px, the logo is stacked above the menu and everything is ok !

Have you got any idea for this 680px value ? I’ve tried to use CSS @media queries, but without success.

Thanks a lot

anyone ?

Hi,

sorry I had some troubleshooting when I tried to log-in !

I pasted your code, and the menu displays properly on IE 8.0.6001.19600 and Chrome 40.0.2214.111 m. But with FF 35.0, the default font is displayed, instead of Helvetica Neue.

So the menu comes across the logo…

thanks