6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

How Do I Acheive This

by Jake Howard
5 replies
  • WEB DESIGN
    • |
Hi Warriors

I am trying to develop my first site, and I am hoping some of you might be able to assist me with a couple of things.

One of the sites I have been basing some of my structure off is www.coffee-cake-recipe.com . Is anyone able to tell me.

1. How they position the thick green line at the very top of the page, with no white spaces.

2. How they manage to stretch the 2 green lines across the full length of the page when the body of the site appears to have a fixed width.

3. How they managed to get the top adsense link unit placed exactly on the green line below it.

My site is www.horse-jobs.net however it is a bit all over the place at the moment while I try to figure everything out.

Cheers

Jake
#acheive
  • Profile picture of the author pjCheviot
    Banned
    Hi Jake

    Briefly, this is all done through the style.css asssociated with the site.

    1. Uses an image with a thick green top and thin green bottom.

    2. Using a "repeat" of the image in #1 across whatever the page width is

    3. Using the adsense link on top of a background image with rounded corners.

    To get a true idea of how it is all put together you can either look at the source code coupled with the style.css file or

    Install a firefox add-on called "firebug" which allows you to inspect certain areas/elements of a site and show you exactly how they are made up.

    You may have a bit of a learning curve - but in the end I think it will be worthwhile. The alternative would be to outsource.

    All the best.
    {{ DiscussionBoard.errors[4097360].message }}
  • Profile picture of the author xtrapunch
    You can find answers to all your questions about HTML/design of any site using Firefox with Firebug add-on. That's what web designers use. At least, I do.
    Signature
    >> Web Design, Wordpress & SEO - XtraPunch.com <<
    Web Design & SEO Agency | Serving World Wide from New Delhi, India

    {{ DiscussionBoard.errors[4097476].message }}
  • Profile picture of the author xtrapunch
    Just wanted to add that you shouldn't try learning HTML or web designing working on a live site. It's not recommended. Even pro-designers create sites either locally or on separate server hidden from Google. Make your site live only after you have it ready.

    As you don't seem to be familiar with designing, you should use a template and edit it to suit your website.
    Signature
    >> Web Design, Wordpress & SEO - XtraPunch.com <<
    Web Design & SEO Agency | Serving World Wide from New Delhi, India

    {{ DiscussionBoard.errors[4097507].message }}
  • Profile picture of the author Jake Howard
    Thanks for all your help guys. I have downloaded Firebug which is a great tool.

    How do people test there site without going live? I was able to do it when I just had an index page, but once I introduced a CDs style sheet and images it became harder.

    Cheers

    Jake
    Signature
    www.inksigns.com.au
    {{ DiscussionBoard.errors[4100390].message }}
    • Profile picture of the author Barko
      Make sure all your files are loose in the same folder(html, images, css, etc.). It should open ok in your browser. If and when your site gets too complicated for that there are software programs that simulate server behavior on a local machine. Some are even free. I use WampServer. It's mostly for testing dynamic behaviors like PHP though. If you need design help with your site let me know.
      {{ DiscussionBoard.errors[4100712].message }}

Trending Topics