SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Evangelist
    Join Date
    Oct 2005
    Posts
    415
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Template Issues - Driving me mad!

    Hi there,

    Some of you may remember that I was designing a website for a Modelling agency. The link to the current beta that im developing is here.
    Beta Site


    The problems that i am having is as follows:

    1.) Because the website is a liquid site, and that the design is highly unauthodox this is causing problems when it comes to placing content within the pages. I am trying to design the website to be easily updated, and whenever i place tables within the partiqular sides the formatting gets all messed up.

    2.) The same applies to images, and this is causing problems for the website as i either need images to auto-resize themselves or get managed within the page.

    3.) if anyone can critisize and come up with another solution, or better more stable code. i would be eternally greatful. I use TinyMCE text area editor, and this is what will be used within the website to manage content, and therefore i need it to beable to use this generated code, and not destroy the website.

    Thanks for your help

    Enormousrodent

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    That design would seem to be more suited to a fixed width as you have a lot of elements that are needing to scale and obviously some won't.

    You could size the images in percent by applying a wrapper to the image that has a percent width. Then in the image tag you just add width="100%" and it will scale to the size of the parent. The height tag is omitted from the img tag which will let the browser maintain the correct height aspect ration as the image is resized.

    However it does depend on the image as it doesn't always look good.

    The image in the middle of this demo is scaled and if you resize the page you will see the effect.

    http://www.pmob.co.uk/temp/3col/3col-percent-01.htm

    It usually means that the image should be a higher size (k) than required so that it doesn't lose too much as it is scaled and start with a bigger image also that is resized smaller.

    The problems will be that you have multiple elements all vying for position and you would need to make sure that everything has as much room to shrink as possible.

    Another alternative would be to also add a min-width (use an expression for ie) that gets applied before the page breaks and maintains integrity.

    Sorry I can't offer anything better.

  3. #3
    SitePoint Evangelist
    Join Date
    Oct 2005
    Posts
    415
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The really frustrating thing is that when there is no content within any of the columns, and you are not using tables to format contact, then there is not a problem for either firefox or ie. This is why i need to either find a better way to place content, or a solution to enable me to place any content within the areas without it messing up/

    Rodent

    Thx btw for the help

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    The problem with tables is that they will stretch to accomodate content and will only shrink to a certain degree and then end up breaking the layout.

    I don't think there's an easy solution to what you want other than being very specific about what you put in each of the columns and ensuring that all elements can compress to a minimum.


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
  •