The Author Online Book Forums are Moving

The Author Online Book Forums will soon redirect to Manning's liveBook and liveVideo. All book forum content will migrate to liveBook's discussion forum and all video forum content will migrate to liveVideo. Log in to liveBook or liveVideo with your Manning credentials to join the discussion!

Thank you for your engagement in the AoF over the years! We look forward to offering you a more enhanced forum experience.

352155 (2) [Avatar] Offline
#1
Hi,

I am working my way through the book and am on Chapter 4 (just completed Section 4.4.3). I must have messed something up in the styles somewhere but the input text field and the send button are appearing **above** the chat messages instead of below within the chat slider. This is occurring in latest chrome 41 as well as in firefox and I have attached a screenshot in chrome. I followed as is from the book and just now downloaded the source and will compare that next. I thought I may have missed a closing div somewhere but went over it a few times and that all seems to be ok.

Just wanted to see if anyone else ever experienced this and what was the fix. I am not the best at css so any help is greatly appreciated.

Thanks alot,
Jason
352155 (2) [Avatar] Offline
#2
**RESOLVED**

I downloaded the code and compared and everything appeared ok. I then used the chrome element inspector and went thru every element in the chat slider comparing the working downloaded code to my broken code. An yellow exclamation caught my attention. Within the css rule for the .spa-chat-box class I had a typo for the position property. Instead of "position" I had "postion". Once I corrected the spelling mistake the chat slider displayed perfectly.

I should have used my ide to type up the files (instead of basic editor) and I would have caught the typo but in the end it was great to see how easy it was to identify issue with chrome inspector. Amazing how far these browser dev tools have come.

Excellent book so far and very glad I purchased it. Having this discussion board to ask and receive help is very helpful.