Archived topic

Reduce background space

7 replies · Started by Nick on March 25, 2015

Viewing posts 1–8 of 8

March 25, 2015 at 12:28 pm #91355

I set my container width to 1500 and still feel like i have a ton of background space. Is there another way to reduce the amount of background space?

March 25, 2015 at 4:55 pm #91439

Absolutely - you can use custom CSS to set it to whatever you like (even 100%):

body.grid-container {
      max-width: 2000px;
}

March 25, 2015 at 8:18 pm #91483

Hmm i tried that and it doesn't seem to do anything for me.

I have also added a header on one of my pages. However, when i add text in the page header it gets bigger and bigger how do i make the page header stay the same size even when i add text?

March 25, 2015 at 11:34 pm #91504

Can you link me to the site where the above code isn't working?

Not sure what you mean by your second problem - when you add text to an area, that area will always get larger so it can fit the text?

Let me know :)

March 26, 2015 at 8:33 am #91714

I have set a color background to the page header and when i add text in the content area the color background gets bigger is there no way to set that background to a fixed size?

March 26, 2015 at 10:35 am #91764

You can set a height using CSS, but I'm not sure why you would want to. Doing so would cut off your text.

First, find the page ID in the <body> element (use Inspect Element in Chrome).

Then add this CSS:

.page-id-xx .generate-page-header {
      height: 200px;
}

Adjust the height to whatever you want.

Doing so will cut off your text inside the page header if it's not tall enough.

March 26, 2015 at 5:15 pm #91879

That code seems to create another header separate from the page header under pages/content.

I found this website in the forums that seems to have what i want for a page header.

www. m o m t r i c k s .com

I want the gray header with text. I can make the header and text but cannot find out how to align,bold,size of the text like that without making that gray header move down when i add text.

March 27, 2015 at 12:08 am #91947

You could do something like this in the Content section of the page header:

<div class="grid-70 mobile-grid-100">
      <h3>Some text in here</h3>
      <h3 style="font-weight: bold;">With some bold text below it</h3>
</div>
<div class="grid-30 mobile-grid-100">
      <a class="button" href="http://google.com">This button links to Google</a>
</div>

Hopefully that helps :)

This archived topic is closed to new replies.

Start building better websites today.