# Drag and Drop problem **URL:** \ **Category:** Beginners\ **Created:** [June 13, 2018, 3:35pm UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968 "2018-06-13T15:35:32Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![dowlassmoss](https://avatars.discourse-cdn.com/v4/letter/d/3da27b/32.png) [@dowlassmoss](https://forum.pinegrow.com/u/dowlassmoss)\ **Post date:** [June 13, 2018, 3:35pm UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/1 "2018-06-13T15:35:32Z")
Hi, new to Pinegrow but liking what I see…just trialling at the moment, but looks promising. (I have to say that I’m using v2.951 and CAN NOT upgrade due to running older Mac OS for vital legacy software for my job) However, having some difficulty with Drag & Drop from the Lib pane. I’ve got a div called div.site-logo into which I’m trying to drag an IMG from the Lib pane. There’s no way I can drop it in the div! It just places itself on the page roughly near where I’m dropping it, but never in the div. If I click on the div and get the actions, there is unfortunately no ‘insert image’ function. It’s the devils own job to drop an image into a div, especiually as by default the drag&drop IMG button lands a bloomin great pic of a flower on the page - not helpful! Any tips for a noobie on how to place a small image within a div? Many thanks ---
**Author:** ![SureWeb](https://avatars.discourse-cdn.com/v4/letter/s/71e660/32.png) [@SureWeb](https://forum.pinegrow.com/u/SureWeb)\ **Post date:** [June 13, 2018, 9:44pm UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/2 "2018-06-13T21:44:43Z")
Locate the div in the tree view, you can then drag and drop directly into the div in the tree. ---
**Author:** ![dowlassmoss](https://avatars.discourse-cdn.com/v4/letter/d/3da27b/32.png) [@dowlassmoss](https://forum.pinegrow.com/u/dowlassmoss)\ **Post date:** [June 14, 2018, 2:58pm UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/3 "2018-06-14T14:58:15Z")
Hi Sureweb, thanks for the tip - that kind of worked, I managed to place a logo image within the existing div.site-logo I say ‘kind of’ because it’s still the devil’s own job to understand the size of the div that’s been placed there. There’s a full width div called div.center, and within that div, aligned right, are 5x ‘a’ links as menu items (each ‘a’ containing text and a href link etc.) The div-site-logo is aligned left, and between it and the first of the navigation 'a’s is a wide space of nothingness. But if I replace the text in the div.site-logo with an image, and the logo image is slightly bigger than the original text box, it throws all the navigation onto a new row…even though there is some 300px gap between the div.site-logo and the navigation div. Frankly, I’ve no idea how, why or where the divs are sized and structured. This would be a lot easier to understand with a screenshot, but doesn’t seem any way to attach one here… regards ---
**Author:** ![Printninja](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/printninja/32/1181_2.png) [@Printninja](https://forum.pinegrow.com/u/Printninja)\ **Post date:** [June 15, 2018, 7:27am UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/4 "2018-06-15T07:27:06Z")
You can attach images by clicking on the upload icon (looks like a rectangular block with an arrow pointing up, and says “Upload” when you hover over it. BTW, are you using a Framework like Bootstrap? ---
**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\ **Post date:** [June 15, 2018, 8:21am UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/5 "2018-06-15T08:21:15Z")
![2018-06-15_09-19-19](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/2/2da1f97a0d4b0023ecf1388651fb89b0397f7614.png) I have been a drag and drop kind of guy and that has MOSTLY worked. super ---
**Author:** ![dowlassmoss](https://avatars.discourse-cdn.com/v4/letter/d/3da27b/32.png) [@dowlassmoss](https://forum.pinegrow.com/u/dowlassmoss)\ **Post date:** [June 15, 2018, 9:33am UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/6 "2018-06-15T09:33:24Z")
Ah…thanks for putting me right on that one! I thought I had downloaded a Bootstrap theme to work on, but a glance in the Javascript folder shows no bootstrap js, although there are global js and jquery files. Attached is a composite pic of the header showing the ‘nested’ elements inside the larger container element (not named in the screenshot but it’s called div.center). I’ve arrowed the gap between site logo and navigation. ![header-layout](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/6/6df7c0aca3629a720dbe47ffda504b36d3b11bad.jpg) Also, I have to admit I don’t understand what ‘CSS Rules’ are in Pinegrow. I know what IDs, classes and selectors are, but I don’t understand Pinegrow’s CSS rules. ?? ---
**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\ **Post date:** [June 15, 2018, 9:03pm UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/7 "2018-06-15T21:03:32Z")
Hi @dowlassmoss, Pinegrows css rules are just… the standard css…stye…rules. in your page. Listed together in Pinegrow’s _Styles_ css viewer tab and editor So, nothing funky, or extra or new. so, as you know ID’s and classes, a class can be composed of any number of style rules from 0 to…a big number. 0 is pointless but handy when setting up your page. fill it in later. an ID is a specific one off _thing_ … a label which is applied to an element to make it unique…for styling for instance. so, the styling you create… which targets that specific ID is a collection of css rules. which when viewed in Pinegrow could be called…Pingrow’s css rules. its just a matter of semantics. if you were viewing it in _cough_ dreamweaver, you could say they were _DreamHeavers Style Rules_. so colour, font, size. each one of these things is a css rule. and when you create a class, it is a collection of css rules. which if you view in Pinegrow, you could call… _Pinegrows Style rules_ they are actually the pages and yours. ---
**Author:** ![dowlassmoss](https://avatars.discourse-cdn.com/v4/letter/d/3da27b/32.png) [@dowlassmoss](https://forum.pinegrow.com/u/dowlassmoss)\ **Post date:** [June 15, 2018, 10:12pm UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/8 "2018-06-15T22:12:46Z")
Hi schpengle, thanks for the response. OK, so ‘rules’ are the selector(s) + attributes. Like `p.intro {font-family:arial; font-size:12px; color:#666;}` I tried to create a new rule but Pinegrow doesn’t seem to have saved it (or written it to the stylesheet) - it’s not happening either in Pinegrow or when published. In this case I might be better off just delving into the stylesheet ina text editor, methinks. Pinegrow’s useful for identifying exisiting rules, though. ---
**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\ **Post date:** [June 15, 2018, 10:43pm UTC](https://forum.pinegrow.com/t/drag-and-drop-problem/1968/9 "2018-06-15T22:43:16Z")
have you checked this out @dowlassmoss? > **[Styling with CSS | Pinegrow Web Editor](https://pinegrow.com/docs/master-pinegrow/style/)** > > Styling – painting and positioning elements – is done with CSS properties and rules. Pinegrow offers a collection of powerful styling tools to suit different tasks and workflows.