Skip to main content
Participating Frequently
February 16, 2022
Question

is this program is for someone who is new to html and css?

  • February 16, 2022
  • 2 replies
  • 1171 views

i just started learning css grid and html, i happened to see this program, is it for someone who already knows how to make websites or also for new learners?.

    This topic has been closed for replies.

    2 replies

    Legend
    February 16, 2022
    quote

    i just started learning css grid and html, i happened to see this program, is it for someone who already knows how to make websites or also for new learners?.


    By @Zaid231951099ddc

     

    I don't think Dreamweaver provides you with any advantage over any other website editor UNLESS you have access to it through having a full creative cloud membership. If not then you are better off using a free web editor such as VS Code.

     

    Css Grid is complex as it can be written in a number of different ways and I dont think any current editor has the ability to provide all of those options, so to get the best out of css grid you will need to learn to hand-code it, which means any web editor or text editor is all you really need and some good resources on css grid of course.

    Participating Frequently
    February 17, 2022

    Do you have any advice for me? I just just started learning html and css grid like 8 days ago. I was mostly into games. 

    Participating Frequently
    February 17, 2022
    quote

    Do you have any advice for me? I just just started learning html and css grid like 8 days ago. I was mostly into games. 


    By @Zaid231951099ddc

     

    Below is a resource that may help you with css grid:

     

    https://css-tricks.com/snippets/css/complete-guide-grid/

     

    However before learning css grid I would advise you to learn Flexbox:

     

    https://css-tricks.com/snippets/css/a-guide-to-flexbox/

     

    Flexbox is a much simpler workflow to grasp initially - you will need to use it in combination with css grid eventually, to leverage all of the benefits.

     

    Css grid is more powerful as its more flexible in terms of producing layouts. The methodology it uses does not restrict it to linear columns/rows which makes the placement of items really easy when you are considering how you would like the flow of items to apppear on mobile devices.

     

    Its going to take a while to grasp learning html/flexbox/grid, etc. I don't know what your long term goals are if any but if those plans consist of perhaps a career in development then learning to code IS THE ONLY WAY to progress, despite what you may hear from others about low-code/no code solutions, frameworks etc. Anyone choosing that route is on a dead end road.

     

    Good luck and post back if you run into problems or have any questions.


    by Learning to Code you mean i should learn to do everything without using snippets? my goals are a career in web development.

    Nancy OShea
    Community Expert
    Community Expert
    February 16, 2022

    If you want a tool that creates basic standards compliant code while you're learning, DW is a good place to start.  The finer points of using CSS Flexbox and CSS Grids will come with repeated use and practice, practice, practice.  To create interactive sites and advanced web apps requires good coding skills.  Tools don't make good websites, people do. 

     

    You can try DW free for 7 days to see how you like it.  If you don't cancel before the trial ends on day 8, your free trial will automatically convert to a paid annual subscription USD $21/mo.

    https://www.adobe.com/products/dreamweaver/free-trial-download.html

     

    Nancy O'Shea— Product User & Community Expert
    Participating Frequently
    February 17, 2022

    What kind of advantages does it have over other editors If i get the clould membershib?. I started like 8 days ago im not putting a lot of effort to be honest. One thing im having problem with is the images and media queries. 

    Nancy OShea
    Community Expert
    Community Expert
    February 17, 2022

    Build for mobile first.  Add a media query for Tablets if you need one.  Add a media query for Desktops if you need one.

     

    CSS Grid Example:

    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title>CSS Grid Evenly Distributed Layout</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
    body {
    width: 95%;
    margin: 0 auto;
    padding: 2%;
    }
    .grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-auto-rows: minmax(150px, auto);
    grid-gap: 1em;
    border: 1px dotted silver;
    }
    .module {
    background: #eaeaea;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    }
    img {
    vertical-align: baseline;
    display: block;
    max-width: 100%;
    }
    </style>
    </head>
    
    <body>
    <h3>Welcome to CSS Grids</h3>
    <div class="grid">
    <div class="module">1</div>
    <div class="module">2</div>
    <div class="module">3</div>
    <div class="module">4</div>
    <div class="module">5</div>
    <div class="module">6</div>
    <div class="module">7</div>
    <div class="module">8</div>
    <div class="module">9</div>
    <div class="module">10</div>
    <div class="module">11</div>
    <div class="module">12</div>
    <div class="module">13</div>
    <div class="module">14</div>
    <div class="module">15</div>
    </div>
    </body>
    </html>
    

     

     

    Nancy O'Shea— Product User & Community Expert