• Resolved jweaving

    (@jweaving)


    I am stuck. I cannot figure out how to widen the body of the homepage for my site.

    The theme seems to be narrowing the body of text.

    Please check it out and you’ll see (it’s easier to see on desktop view): Kitchen Cabinets

    If anyone can please help with code to help me widen the body in the center, I would greatly appreciate it.

    Thank you in advance!

Viewing 6 replies - 1 through 6 (of 6 total)
  • First of all, you should consider that some visitors to your website may have wider monitors than you do.

    A reasonably sized “wrapper” is common among websites to make sure that content doesn’t get stretched out too thin at wider window widths.

    Anyway, you can use the following custom CSS to adjust:

    @media screen and (min-width: 860px) {
    	#front-pagecontent .entry-content {
    		max-width: 1000px;
    	}
    }

    I just made up the 1000 number. Previously, it was 560. Adjust it to whatever you feel comfortable with.

    Going back to my first point, I’d also recommend decreasing the font size of the page in your browser (usually by pressing ctrl/cmd plus the – key) to get an idea of how it will look on wider screens.

    Thread Starter jweaving

    (@jweaving)

    I think the text looks good on 13″ and iPhone 6 Plus… any thoughts?

    We’ll just need to do some adjustments to paragraphs and such… maybe font sizes for emphasis. It seems that on mobile everything adjusts properly.

    The only thing is that on 13″ the graphic got really blown up. Would it be as simple as reducing the graphic?

    Could you clarify which graphic you’re referring to? The “Your New Remodel” one?

    Thread Starter jweaving

    (@jweaving)

    Yes, the “Your New Remodel” graphic.

    It resizes great on mobile, but on my 13″ it is blown out.

    Is there anyway to reduce the size of the “Your New Remodel” graphic for desktop view?

    The same with the text?:
    Kitchen Cabinets & Bathroom Remodeling Experts
    Looking to remodel your kitchen or bathroom?
    Let us come to you!

    We will need to edit this text to show some emphasis, but I notice that it’s already fairly large on mobile. How do we avoid such large resizing on mobile for the text if we make the text larger on desktop?

    There are ways to reduce and increase the size of whatever you want. I suggest reading up on the max-width and font-size CSS rules.

    I know this isn’t what you asked, but I would reconsider placing all that content in an image. It is not accessible. I suggest reading the Accessibility article on www.ads-software.com for some background.

    As for differing styles on mobile, this can be accomplished with a media query.

    Thread Starter jweaving

    (@jweaving)

    We’ve taken your advice on the graphics. Thank you! That seems to work best.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Help with adjusting width of theme's body?’ is closed to new replies.