Part of theme not centering

Hi sirhunna, did you still need any help with this? Just let me know and I’ll have a look. Thanks!

I do!

Honestly, I haven’t looked at it much since I posted this. I try not to post questions until I exhaust every option and that is where I was.

I can get everything but that dang black vertical line to center and I couldn’t figure out why. grrrrrrr:)

Thanks!

Hi there, the way I was able to get the vertical black line to be in the right place is by adding the following CSS:

body {
	background-image: none;
}

#wrapper {
	width: 1200px;
	margin: 0 auto;
	background: #fff url(https://your-site/wp-content/themes/esquire/img/bg.png) repeat-y 0 0;
}

Adjust “your-site” accordingly.

You’ll need to add a new wrapper div in whatever files you’re using, including at least index.php.

I added

<div id="wrapper">

just above

<div id="posts">

and its corresponding closing

</div>

just above

<?php get_footer(); ?>

You can repeat this process in any of the relevant template files you’re using, such as archive.php

Let me know it goes!

Just a heads-up that the best way to make changes to a theme is to use a child theme, so your tweaks won’t be overwritten when updating the theme. Here are some guides in case you haven’t made one before:

https://codex.www.ads-software.com/Child_Themes
https://op111.net/53/
https://vimeo.com/49770088

So this worked!!! almost lol….

I had to moved around that <div id="wrapper"> to a higher place to include the yellow sidebar but that was easy.

The only issue is that the link to my design portfolio and email address that floats towards the bottom left won’t adhere to the width. And I know it’s because it has a position: fixed attached to the div. I figured out how to have it hang out at the bottom and move around within the width but I want to have it fixed to that area so it is visible at all times.

That link/email in under <div id="credit"> which is of course is included in the <div id="wrapper">, though that obviously didn’t do it. I thought if including a width within #credit as well, but above the position: fixed, that that would do it, but no dice.

Check it out now and widen the page, you will see what I mean.

hunterstanford.com/blog

Like I said, I want it fixed flush underneath the yellow sidebar but always appear right at the bottom of anyone’s page, hovering as they scroll down.

Either way, thanks for all your help:)

I figured it out!

I moved the <div id="credit"> up in the footer.php and I guess that then included it properly into the wrapper.

Thanks SO much for your help:)

Glad you got this working as you wanted – it looks great!

Thanks for sharing what you did – it may help others on an Esquire centering adventure in the future. ??