Skip to main content
A
Adamovitch
Inspiring
July 28, 2021
Answered

View vertical ruler Dreamweaver 2021 MAC

  • July 28, 2021
  • 2 replies
  • 739 views

Hi, might sound like stupid question but I only see horizontal ruler.

How do I view vertical ruler? I cannot see anything in menus for rulers at all.

Many thanks,

Adam

    This topic has been closed for replies.
    Correct answer Adamovitch

    Answered my own question. I need to be in Design View Mode!

    2 replies

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    July 28, 2021

    @Adamovitch,

    Just curious, how is a vertical ruler of any benefit to you in web design?

     

    I've never needed a vertical ruler for layout.  Positioning elements on web pages with pixel perfect precision is not possible. Web pages are not a fixed sized media like a sheet of paper.  Web pages are flexible.

     

    Nancy O'Shea— Product User & Community Expert
      A
      AdamovitchAuthor
      Inspiring
      July 29, 2021

      Hi Nancy,

       

      I am recoding web pages to make them responsive but without changing appearance of existing desktop version.

      Therefore I need to ensure all content is positioned identically both horizontally and vertically.

      I first tried to apply media queries to existing code but that failed miserably.

      So I decided to code from scratch using Bootstrap. I am a novice and having some problems sizing the columns to achieve my goal. Do you think this is foolish approach? I know it depends on the content but don't really want to redesign, just make it look better on mobile devices.

      Thanks!

      Nancy OShea
      Community Expert
      Nancy OSheaCommunity Expert
      Community Expert
      July 29, 2021

      Responsiveness is NOT about appearing the same on all devices. It's about performing well on all devices.  Two different things.

       

      Unfortunately, trying to make an old desktop layout look & work exactly the same on small devices is fool's folly.  It will never work exactly the same because users interact differently with mobile and touch screen devices.  Also we can't predict what size devices, which browsers & browser settings, fonts and text sizes people will use. Those are unknown variables that we can't control.  The best we can do is build a mobile-first layout in single column that extends to 2 columns across on small tablets, 3 columns on medium devices, 4 columns on large devices and so on... 

       

      Bootstrap is a good tool for making responsive sites.  The 12-box grid system is logical and works well for sm, md, lg and xl devices without tedious custom coding or manual media queries.  Bootstrap's built-in classes will save many hours of development time and yield good results for the widest range of device users. 

       

      Bootstrap Documentation:

      https://www.w3schools.com/bootstrap4/

      https://getbootstrap.com/docs/4.6/getting-started/introduction/

       

      Post back if you need more help.

       

      Nancy O'Shea— Product User & Community Expert
      A
      AdamovitchAuthorCorrect answer
      Inspiring
      July 28, 2021

      Answered my own question. I need to be in Design View Mode!

        Jon Fritz
        Community Expert
        Jon FritzCommunity Expert
        Community Expert
        July 28, 2021

        If you are trying to create pixel perfect heights, I suggest enlarging your html text by 5, 10 and 20 pixels  to see if your design falls apart or not.

        The height of your page is determined by your content and by the user's browser settings. Things that look great when your html text is held to 12px, or 1.5em, or 14vh have a habit of blowing apart when zoomed in on, in order to help those viewers with less than perfect eyesight read the page.

        Don't rely on height remaining static online, it's not.

          Terms & ConditionsAccessibility statement
          Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices