Quantcast
Channel: Serif Software Forums (Closed) - WebPlus
Viewing all articles
Browse latest Browse all 4745

WebPlus X6: Gradient background help!

$
0
0
Hi, I've managed to get this to work on my site but it has only come up a few pixels wide rather than filling up the blank white parts on the outside of the page. I'm pretty new to this so apologies if it is a really simple thing, but any help would be appreciated.

I just followed the instructions from the post below.

Quote:

Originally Posted by djln10 (Post 829540)
Hi Sue,

In order to have your website page colour have a graduated background you can do this with a little CSS as follows:

1. On your master page select a plain on page site colour (Right click the master, properties, background - select ‘use page background’ then select a page colour.

2. Click on the ‘Attach HTML to page’ button on the top menu.

3. You’ll see the source code for the page - Look for the ‘div’ which starts immediately under the opening ‘Body’ tag. Inside the code for that div you’ll see it says:

Code:

__AddCode="Master DIV Tag"
Delete that and replace it with:

Code:

id=”masterdiv”
4. Once you’ve done that, on your master page, select Insert from the top menu and select ‘HTML Fragment…’

Paste the following to the HEAD of the fragment (check ignore page position):

Code:

<style type="text/css">
#masterdiv {
background: #FFFF2A; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFF2A', endColorstr='#FFFFD4'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#FFFF2A), to(#FFFFD4)); /* for webkit browsers */
background: -moz-linear-gradient(top, #FFFF2A, #FFFFD4); /* for firefox 3.6+ */
}
</style>

Click ok - you can just make this fragment small and stick it out of the way somewhere at the top of the master page.

All you need to do is change the hex colour values to ones that you want. The start colour at the top is the first value and the second value is the end colour. It needs to be repeated on all three lines, as you’ll see above, to accommodate for different browsers.

That’s it! You won’t see this in WebPlus but you will if you preview your pages and when published.

It now means that all of your site pages will use the gradient background from top to bottom no matter what size your pages are.

Attached is a WebPlusX6 example file.

Hope that helps.

David.

Any help would be appreciated

Viewing all articles
Browse latest Browse all 4745

Trending Articles