SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Enthusiast
    Join Date
    Jan 2004
    Location
    Hull
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Will it be possible, concept design to CSS

    Hi all,

    I've been given a concept design to convert to HTML, now I have done a couple of sites and have always used CSS but the company normally uses tables so the design isn't really geared towards a CSS layout.

    My question is whether the design which can be seen here:

    http://point.websights.co.uk/one.html

    My css is fairly good. Any suggestions would be welcome.


    TIA,
    Darren

  2. #2
    Put your best practices away. The New Guy's Avatar
    Join Date
    Sep 2002
    Location
    Canada
    Posts
    2,087
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    CSS would be perfect for that.
    "A nerd who gets contacts
    and a trendy hair cut is still a nerd"

    - Stephen Colbert on Apple Users

  3. #3
    SitePoint Zealot want2design's Avatar
    Join Date
    Aug 2002
    Location
    Australia
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Darren,

    I just did a quick slice of how I think you should go about setting the website out. Although this is just my opinion, so you or someone else reading this thread may think of a more convenient method of laying out the website.

    The top row would be the dimensions of the top slice (800x170), with the actual top slice image being set as the background.

    The second row would be the dimensions of the second slice (800x21), with the actual second slice image being set as the background. I would change the navigation from images to text (to make it easily editable later on).

    On the 3 columns in the third row, I have quickly used the scale tool to demonstrate how I think the elements should be placed (I tend to get a bit picky with exact pixel measurements). You'll notice that both the three columns have 20px padding on either side, this is to maintain a consistant feel.

    The first column (third row) would be the dimensions of the third slice (120x410), with the actual third slice image being set as the background (top, no repeat), and the background colour as white. This will allow your body content (in column two) to stretch further than your image's height.

    The second column (third row) would be 560px wide, with a padding of 20px on all sides (top, right, bottom, left).

    The third column (third row) would be the dimensions of the fifth slice (120x140), with the actual fifth slice image being set as the background (top, no repeat), and the background colour as white. Once again, this will allow your body content (in column two) to stretch further than your image's height.

    I've missed out a few minor details, but you will be able to fill in the blanks.

    Hope this helps!



    Edit:

    I apologise, my attachment did not work for some reason.

    I have uploaded the image to my webhost below:

    http://home.swiftdsl.com.au/~bencumm...uick_slice.gif


  4. #4
    SitePoint Enthusiast
    Join Date
    Jan 2004
    Location
    Hull
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Excellent, interestingly thats very similar to what I had although I had 2 not 3 columns but I now see the error of my ways.

    One problem I was having is gaps between header and nav even with padding and marging set to 0.

  5. #5
    SitePoint Zealot want2design's Avatar
    Join Date
    Aug 2002
    Location
    Australia
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Were you nesting your DIV's?

    If you can provide the CSS you are using when you get the error with the gaps, we can take a look for you.



  6. #6
    SitePoint Enthusiast
    Join Date
    Jan 2004
    Location
    Hull
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ignore me, I was being a muppet. I was embedding the header not having it as a background image so its all sorted.

    Thanks for the help.

  7. #7
    SitePoint Zealot want2design's Avatar
    Join Date
    Aug 2002
    Location
    Australia
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No worries, glad you got it sorted.




Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •