Full Screen with Quintus ?

marcfauvet · Member · Aug 11, 2014 at 6:17 pm
Copy link

Add topic to favorites
hi !
i’d like to have http://thelimpcobra.com in full width or at least greatly reduce the borders on either side when viewed on computers. (it goes full screen on tablets and phone)
i have the customise package and inspect element but as a numpty… i can’t figure out if this possible or not.
i’d really appreciate your help !
thanks,
marc

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Aug 11, 2014 at 7:50 pm
Copy link
Hi Marc, one of the concerns, from a design standpoint is in getting the content width too wide and reducing readability. The general rule is to keep the content width around 500-650px in width and Quintus has a width of about 640px with its original width with a maximum overall width of 1100px (in #page).

That said, the following will allow you to increase the maximum width of your site. Go to Appearance > Customize > CSS, delete all the informational text in that window, and paste in the following custom CSS and adjust the max-width value to your liking.

You will also have to create a new header image and insert it through the CSS. Upload the image to your media library, get the URL of that image and replace URL_OF_IMAGE between the quote marks with the URL of your new image. The image will need to be the same width you set in #page rule below.
```
#page {
    max-width: 1100px;
}

.blog-header {
    background: url("URL_OF_IMAGE") no-repeat scroll center top !important;
}
```
marcfauvet · Member · Aug 12, 2014 at 7:41 am
Copy link
woW ! excellent ! thanks a lot Mr Path !
installed your code and will be tinkering more with it soon till its just right.
great day to you and thanks again,
marc
marcfauvet · Member · Aug 12, 2014 at 7:58 am
Copy link
hi again !
one last thing if you don’t mind.
how could i eliminate the thin black frame that surrounds all the content ?
cheers,
marc
marcfauvet · Member · Aug 12, 2014 at 8:04 am
Copy link
or reduce its thickness.
thesacredpath · Member · Aug 12, 2014 at 5:58 pm
Copy link
Great, glad that did the trick for you. To adjust the thickness, corner radius and/or color of the border around the content area, add the following CSS.
```
#page {
    border: 3px solid #050505;
    border-radius: 3px;
}
```
If you wish to remove it entirely, add the following instead.
```
#page {
    border: none;
}
```
Personally I like it with a bit of a border, so you might try setting the width to 1px and then setting the color to a lighter grey, such as #DDDDDD.
marcfauvet · Member · Aug 12, 2014 at 6:03 pm
Copy link
thanks a million ! i really appreciate your help.
i’ll try that asap.
cheers,
marc
thesacredpath · Member · Aug 12, 2014 at 7:21 pm
Copy link
You are welcome, Marc.

No items found.