4 Replies Latest reply on Dec 9, 2013 9:55 AM by KevinB9

    Why use a div to insert image?

    KevinB9 Level 1

      Hi. Can someone explain why David Powers inserts a div element ("hero div") for the sole purpose of inserting an image? Why not just insert the image without the div? Also, how does he style the hero div and hero div img? Thanks.

        • 1. Re: Why use a div to insert image?
          David_Powers Adobe Community Professional (Moderator)

          The hero div is not used for the sole purpose of inserting an image. It also becomes the container for an article element, and is used to create the containing block for the article, which is absolutely positioned.

           

          You can find out how the hero div and hero image are styled by studying the style sheet, main.css, in the completed folder of the download files.

          • 2. Re: Why use a div to insert image?
            KevinB9 Level 1

            David, thanks very much for getting back to me. Much appreciated. I will go back and take another look at the hero div. Yes, I overlooked that business with the article.

             

            To give you a bit of background - I am trying to teach myself Dreamweaver CC from scratch. It's a bit like trying to build my own automobile so that I can travel across town. I probably should have called a taxi, except now I have spent so much time and money (over $100 just on books) on Dreamweaver that I don't want to give up. Also, I have to admit that I am not as quick as some other people to learn new computer programs. I have to do things over and over again in order to commit them to memory.

             

            About the lack of "cohesion" at Adobe. Coordination would be a better word. It seems to me that the tutorials go in all different directions without any unifying rubric. To give you another example - you have two different tutorials with different approaches to the Bayside website. In one you "create a new CSS file", in the other you "attach an existing CSS file". (I find the former to be vastly more instructive for the beginner. What beginner has an existing CSS file?) OK, if the reader happens to stumble across the two tutorials at different times, well fine. The reader can make the comparison, but shouldn't you cross reference the two approaches?

             

            Again, sorry to sound like such a whiner.  Sometimes my frustration gets the better of me.  I'm trying to be constructive.

             

            Best wishes,

            Kevin Burke

            Cambridge, Massachusetts

            • 3. Re: Why use a div to insert image?
              David_Powers Adobe Community Professional (Moderator)

              Learning how to build websites is a lot more difficult than most people seem to think. Persevere, and you'll get there.

               

              My advice would be to abandon the approach of "learning Dreamweaver". Concentrate instead on learning HTML and CSS (while using Dreamweaver as the tool to create the necessary files). Once you have a solid understanding of the basics of HTML and CSS, using Dreamweaver will become much easier.

               

              To keep the video tutorial reasonably short, Adobe asked me to create the basic styles beforehand. That's why an existing file was used, instead of creating one from scratch, as happened in the much longer written tutorial.

              • 4. Re: Why use a div to insert image?
                KevinB9 Level 1

                David, I greatly appreciate the effort you are putting in to help computer dummies like me.

                 

                Let's face it, Dreamweaver CC is a bloody difficult program to learn from scratch when you are working all alone as I am. If I were working with a trial version I would pack it in, but I have made a huge (for me) financial investment so I have to keep pushing ahead.

                 

                That's why the books and tutorials are so important for someone in my position.

                 

                In commenting on your note above - I actually do have a pretty good understanding of html and css. I have the latest book by Elizabeth Castro on the subject. What I need help with is PLACEMENT ON THE PAGE and AVOIDING INTERFERENCE and for that I need Dreamweaver. I wish the lessons would spend more time on this instead of leading the reader to finish a pre-conceived website.

                 

                If Dreamweaver were a foreign language, Adobe would want everyone to first learn complete sentences - "I would like a room for two with a view of the ocean." Fine, but what if you want to say something else like - "Officer, I was robbed on my way to the beach and my passport was stolen."

                 

                What I'm getting at is that Adove should spend more time on GRAMMAR and VOCABULARY with exercises independent of a finish website.

                 

                A case in point is the official Dreamweaver CC CLASSROOM IN A BOOK from Adobe which gvies only a few excercies in Chapter 3 (nothing on "float" or "clear", for example) and then suddenly in Chapter 4 the book says, "Start sketching your website on the back of a napkin!" What? The reader is not ready for that. What the reader needs is lessons on how to position elements on the page reliably without everything flying apart.

                 

                Can you suggest any other resource for me with that in mind - online or in print?

                 

                Best wishes,

                Kevin Burke

                Cambridge, Massachusetts