Skip navigation
Currently Being Moderated

The fluid grid divs havd no handles. How can this be fixed ?

Apr 6, 2013 6:55 PM

Tags: #html5 #cs6

I have the mobile page ready to start styling but there are no handles on the divs so that I can size them and move them up and down.  What can I do to fix this?

 
Replies
  • Currently Being Moderated
    Apr 6, 2013 8:00 PM   in reply to 333swanlake

    Where do I start?

     

    Perhaps by explaining that you need to have an understanding of HTML and CSS if you want to do anything in DW.

     

    DW is not a true wysiwyg program, nor does it cater for moving elements around like some other programs allow you to do.

     

    There is no magic attached to DW. You must learn first.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 7, 2013 11:21 AM   in reply to 333swanlake

    Not sure what you're asking.  See screenshots below.

     

    Select Fluid Grid Layout and hit Create button.

    FluidGridStartUp.jpg

    Go to View > Visual Aids > enable Fluid Grid Layout Guides. 

     

    To resize divs (green boxes), click & drag the right sides & snap to grid.  By default, DW puts gutters between floated divs.  See screenshot.

    CS6FluidGrid.jpg

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 8, 2013 3:23 AM   in reply to Nancy O.

    i had the fluid grid handles.....but then they dissappeared...how do i get them back?...

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 10, 2013 11:28 AM   in reply to donb0130

    Hi donb,

     

    Was your issue resolved ?

    Are you facing thi sproblem on just one file or all the new files foo ?

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 10, 2013 10:19 PM   in reply to donb0130

    are you puting your cursor inside the div?

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 2:34 AM   in reply to 333swanlake

    i sort of fixed the problem....i restarted my computer....got them all back....but i seemed to have lost the handles on just one of the divs again...cursor on the inside does nothing...curson on the border is dark blue....other divs are ok and have handles....

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 3:44 AM   in reply to donb0130

    This means that one or more default properties provided by DW for that div have been changes manually.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 4:10 AM   in reply to 333swanlake

    i lost the handles on the 'big' size browser but not on the 'smaller' size browsers for that div...i made more changes to the css there...i'll see if i can change the css and get the handles back....at this point do i have to restart the computer to get the handles back?

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 4:21 AM   in reply to donb0130

    Hi Donb,

     

    Can you please share the HTML and CSS of the page you are trying to edit ?

    Are you on 12.0 or 12.0 ?

     

    I don't think restart will help, as its the values in the CSS files which make DW decide on showering the Handel or not.

     

    Is your DIV using the same CSS selector used by its parent ?

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 5:59 AM   in reply to 333swanlake

    i am now on 12.2....this is the first time i am using 12.2

     

    i'll try some code snippets first

    html

    <div id="title" class="fluid"></div>

     

    css

    for small browser screen---(handles are on this div)

    #title {

              text-align:center;

    }

     

    for medium browser screen--(handles are on this div)

     

    #title {

              text-align:center;

    }

     

    for large browser screen--(handles are NOT on this div)

     

    #title {

              position:relative;

              clear: both;

              float: left;

              margin-left: 7.7464%;

              width: 84.507%;

              display: block;

              margin-top:0;

              text-align:center;

     

              font-family:Verdana, Geneva, sans-serif;

              font-size:16px;

              font-weight:bold;

              color:#fff;

              text-align:center;

    }

     

     

    all the other divs on the html page are ok...

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 10:49 AM   in reply to donb0130

    My advice is:

    #1 don't tamper with code in FluidGrid or boilerplate.css files.   

    #2 use a separate external style sheet for your content styles.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 12:17 PM   in reply to donb0130

    If your desktop size consists of 12 columns then updating following values should solve your issue:

              margin-left: 7.7464%;

              width: 84.507%;

     

    I would  be interested in understanding how you ended up with the values mentioned by you, if they were not manually updated.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 11, 2013 1:36 PM   in reply to 333swanlake

    thank you nancy o for your advice.......

     

    reach puneet...i erased the margin-left and width items...and the handle came back. i don't know how i got those values....i wouldn't have thought i did them manually...but maybe i did...i need to pay more attention to what i am doing!!

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 14, 2014 10:56 AM   in reply to 333swanlake

    I have the SOLUTION!  Here is what has happend...

     

    In the fluid-grid.css that you first created...

     

    Find the class that no longer allows you to have the handles (ie. the handles disappeared from my .pageHeader class)

     

    Add width: 100%; inside of the brackets.

     

    .pageHeader {

    width:100%

    }

    Save the file and go back out to Design View.  You have the handles back!!!

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 11, 2014 8:32 AM   in reply to 333swanlake

    Modification that IS the correct answer.  The problem is in the fluid-grid css that is created with the page

     

       look to see what width = in .fluid

     

     

    You may have some % that is not 100.  It needs to be 100%.  Once you change that ALL of the sizing handles came back!!!!

     

    WAS:

    .fluid {
    clear: both;
    margin-left: 0;
    width: 98%;
    float: left;
    display: block;
    }

     

    CHANGE to:

    .fluid {
    clear: both;
    margin-left: 0;
    width: 100%;
    float: left;
    display: block;
    }

     
    |
    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