[Theme: Twenty Twelve] Styles have broken two colum blog

  • I have been tasked with rebuilding a broken site and have done pretty well until this problem,

    SITE: https://happypea.ca

    The blog (INSPIRATION in the menu) should be two columns but is only one with the sidebar under it instead of beside. I believe the CSS had been changed to make their front page work but ended up breaking the blog.

    I just want to get it back to a nice two column WITHOUT breaking the front page. (their front page was built very unorthodox, as if it was a regular site, has class=”wrapper” for instance right in the body/text area of the front page)

    I’m at a loss and ANY help would be greatly appreciated!

    Cheers,
    Brendan

Viewing 10 replies - 1 through 10 (of 10 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Can you not just float both the primary and secondary divs left and give them appropriate widths?

    Thread Starter brendanalbert

    (@brendanalbert)

    Thanks for the reply…Does not seem to work, Seems there is conflicting and overwriting code all over the place. I cannot figure it out.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    What CSS did you try and where did you put it?

    Thread Starter brendanalbert

    (@brendanalbert)

    I took over a site from someone else, I linked the site. it would be too much code to put here. Its super confusing as she had not used wordpress before and treated it like a normal site, she changed the original css file for the theme. You can see whats up with “Firebug” plugin.

    for example, this is in the basic text area of a normal wordpress page (set to the front page)

    </header><!-- #masthead -->

<div id="page" class="hfeed site" style="position: relative; top: -100px; z-index: 700">

	<div id="main" class="wrapper">

<img src="https://www.aligndelivers.com/happypea/wp-content/uploads/2013/01/banner-img.png" alt="banner-img" width="100%" height="300px" class="size-full wp-image-93" style="margin-top:-42px" />

<div class="intro">

<p class="large">At happy pea we want to work with you to simplify your life.</p>
<p class="large">We create productive and organized environments to live and work in, leaving you more time for your passions.</p>
<p class="large">Why do we do that? Because that is our passion.</p>
<div class="subIntro">
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Sorry I was referring to the CSS you used to try to float and give widths to the primary and secondary divs. Should only be 4 lines of CSS .

    Thread Starter brendanalbert

    (@brendanalbert)

    that is the front page, I have a feeling that whatever she did to make the front page work broke the blog

    Thread Starter brendanalbert

    (@brendanalbert)

    there is a ID and Class for each of the divs it looks like:

    id=primary class=site-content

    and

    id=secondary class=widget-area

    FROM CSS FILE:
    I can find NOTHING for the id’s anywhere

    .site-content {
		float: left;
		width: 65.104166667%;
	}

.widget-area {
		float: right;
		width: 26.041666667%;
	}

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If it’s a HTML issue you should run the code through the HTML validator, https://validator.w3.org , and look for unclosed divs, or too many closed divs.

    Thread Starter brendanalbert

    (@brendanalbert)

    I think whatever she has done to force the width on the front page is overriding the blog width.

    Thread Starter brendanalbert

    (@brendanalbert)

    Ok, I’ll check it out

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘[Theme: Twenty Twelve] Styles have broken two colum blog’ is closed to new replies.