Skip navigation
phonzs
Currently Being Moderated

Quick question for the amazing professionals

Oct 18, 2013 7:17 AM

Hello everyone,

 

Im using Dreamweaver CS6

 

Im stuck on somehting & maybe to alot of professionals it might be easier for you.

 

So lets try to imagine, that I have a blank website templete, & I want to have some small amount of text

 

on the right side of the templete, and have a column of text going down. Now the only trick is for me

 

say I want to take my right corner of my window broswer and scale to make it just lttle bit smaller I

 

want to have that small amount on text column move with it, instead of disappearing off the screne

 

which I been getting.

 

 

 

Now, my guess use a container right? or not the best way to go about it!

 

 

 

So if anyone can help me solve this problem that will be amazing or anyone knows a perfect website witha great tutorial that is very close to what I need to figure out that will be amazing as well.

 

I tired looking on-line for something even close to what Im trying to figure out but no results

 
Replies
  • Currently Being Moderated
    Oct 18, 2013 7:23 AM   in reply to phonzs

    I don't understand what you are asking. Can you show us a screen shot of what you want?

     
    |
    Mark as:
  • Currently Being Moderated
    Oct 18, 2013 7:36 AM   in reply to phonzs

    I guess you are using a fixed width design set in px? You need to use a responsive or fluid contruction which used % rather than a fixed width.

     

    So for instance if you have a two column design you could set col 1 at 85% and col 2 at 15% both columns would still be visible on screen as you closed down the browser viewport.

     
    |
    Mark as:
  • Currently Being Moderated
    Oct 18, 2013 7:55 AM   in reply to phonzs

    It's a 3 col design what you have shown so far. The columns need to be flexible so they move with the browser viewport when it is narrowed and widened.

     

    Example:

     

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>Untitled Document</title>

    <style>

    #wrapper {

        width: 96%;

        max-width: 960px;

        margin: 0 auto;

        background-color: #ccc;

        overflow: hidden;

    }

    #leftCol {

        float: left;

        width: 20%;

    }

    #centerCol {

        float: left;

        width: 60%;

    }

    #rightCol {

        float: left;

        width: 20%;

    }

    </style>

    </head>

     

    <body>

    <div id="wrapper">

    <div id="leftCol">Left Col</div><!-- end leftCol -->

    <div id="centerCol">Center Col</div><!-- end centerCol -->

    <div id="rightCol">Right Col</div><!-- end rightCol -->

     

    </div>

    </body>

    </html>

     
    |
    Mark as:
  • Currently Being Moderated
    Oct 18, 2013 8:21 AM   in reply to phonzs

    Its not possible with the code you are using as everything is absolutely positioned and has a specific width.

     

    Using absolutely positioned containers is simply the wrong approach.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points