HarleyGolfGuy (8) [Avatar] Offline
#1
Hi, I ordered your book with the MEAP program and am just getting started. Just after listing 2-7 on pp 38,39 at this point my web page renders the bread img below the fridge img instead of "in the fridge" or on top of the fridge. Can you give me a hint as to what I'm doing wrong here?

Thanks!
stephan.hochhaus (92) [Avatar] Offline
#2
Did you add all the CSS to your application?
https://github.com/meteorinaction/ch02-myfridge/blob/master/myFridge/myFridge.css

As you can see with the live version it should place things inside (and not on top) of the fridge.
HarleyGolfGuy (8) [Avatar] Offline
#3
Thanks, I copied the .css file from the github repo and it works now!
355705 (1) [Avatar] Offline
#4
You should include all the CSS in the source files in Listing 2.1 on Page 22. While you note later, “More styles are required to place the products inside the boxes…”, I didn't know that meant the bread won't be in the fridge at all and will appear under it! I also didn't remember that note when I got to Page 39 and you say “the application will look like figure 2.6 now” when it actually won’t.

I spent serious amounts of time trying to debug my code when it was 100% correct, but I didn’t see the bread loaf below the fridge because my browser window was small - so I assumed it was a query or collection problem. The space you will use up by including all the CSS can be offset by deleting the "Note: More styles are required...".

Alternatively, you could just add the specific CSS required to put the bread in the fridge: #fridge ul {position:absolute; top:0; left:0}. One line!
373498 (1) [Avatar] Offline
#5
The necessary CSS should really be included in listing 2.1 - especially given that this is the first real example in the book. The note beside the listing is not clear, and it's very far away from where the problem will be discovered. Every other bit of code for the example is given in full, so I'm not sure what the motivation is for leaving the CSS out. It is causing a problem that could have been easily avoided.