Shadow around a webpage

  griffo 10:07 31 Mar 2008
Locked

I am working on a new look for an old site, using Dreamweaver CS3 and wish to place a shadow around the webpages. I have seen sites where this has been done and like the effect.

Can anyone tell me how to do this please?

PS. I have constructed the index.html template using tables (nested), not CSS.

  barryoneoff.co.uk 22:26 31 Mar 2008

If you look at the shadow on my web pages, it's just a background graphic I made.

  griffo 23:43 31 Mar 2008

That's more or less what I want (although I was aiming at a graded shadow all round the entire page, so it 'stands out' from the background colour.

Do you mind telling me how to do it please?

  MAJ 09:03 01 Apr 2008

Post a link to one one of the sites where you have seen the effect, griffo, it'll give us some idea of what you're trying to do.

  griffo 09:31 01 Apr 2008

Here's one example:- click here

and
click here

  Kemistri 10:48 01 Apr 2008

...that, as you're developing one or more websites, you are familiar with the code-related add ons that are available for Firefox.

If you use CSS Viewer and hover over the right point, you will see that it has a GIF background called bg.gif, which you can easily view - click here. If you want to study the markup in more detail, use Firebug.

  griffo 12:52 01 Apr 2008

Sadly, not a safe assumption!

I'm very much new to this. I've attended a short evening class on Dreamweaver, which touched a bit on Photoshop, so I'm really inexperienced.

We have 2 sites and I want to try making some basic changes to try to improve their appearance and content. I'm starting with the oldest site which seems to be based on tables. As it was constructed at least 5 years ago, I'm fairly sure that's right?

I must confess I'm not finding my way around the software easily, so I'm trying to take it slowly and only make changes on my PC before uploading anything to the site(s).

  Kemistri 14:11 01 Apr 2008

I tend to expect that those who use (and can justify the cost of) Adobe's professional software are reasonably skilled in their methods and are not new to graphics, image editing or website development. I would be reluctant to let a complete newbie loose with these apps because learning how to use them gets in the way of learning everything else that you need to know.

You will help yourself by using a standards-compliant browser (not IE6 or 7, preferably Firefox) in development and use other browsers for bug testing. You can make good use of Firebug to test and debug your own work and any other site on the net.

  MAJ 16:34 01 Apr 2008

At it's simplest, griffo, it's just an image created in your preferred image editor. You could then insert that image in a layer in Dreamweaver and manoeuvre it to the edge of your content, checking how it looks in the browser as you go.

  griffo 18:20 01 Apr 2008

OK, if I understand -0 I just create a new layer, select a colour and grade it from the centre out?

If that's right, how do i make sure it's the right size relative to the page? Do I set it at say 10 - 15 pixels larger than the basic site template (index.html)?

Sorry to ask so many questions. In view of earlier comments I wonder if I should seek a forum for beginners?

  Kemistri 18:29 01 Apr 2008

Why not just select by colour range to grab the background and fill that with whatever colour or gradient you want? You may need to convert the image to another format first. Or invert that selection and lift out the text onto a new image, if that works better for you.

It's little things like this that highlight the importance of knowing your chosen image editor inside out.

This thread is now locked and can not be replied to.

Elsewhere on IDG sites

Intel Coffee Lake release date and specifications

12 Amazing British Craft Beer Label Designs

watchOS 4 review

Les meilleurs navigateurs internet 2017