cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Level 6

Feedback - CSS Conflict on Invoice Input Page

I have tried to report this via Cog/Feedback but that justs locks the browser (Chrome 78) - something that, perhaps, would be useful to feed back about if only the Feedback didn't lock the browser!

 

Anyway - in the last month or so, there has been an irritating bug on the invoice input page.

The Customer Message & Statement Message boxes are usually deep enough to enter 5 or 6 lines of text.

However, sometimes these boxes are only 1 or 1½ lines deep (although about double width).

Not earth-shatteringly important but irritating when you routinely use 4 lines in the Customer Message.

 

I have tried a number of 'fixes' - none of which work consistently.

Clear cache & use Chrome Incognito sometimes returns the box to normal - sometimes doesn't.  When it does work a page restart or F5 refresh can knock it back again.

 

Using IE11 has more success - mostly works correctly - but other things don't seem to render correctly.

 

This got me thinking - I remember from years back that IE & Chrome often render CSS differently.

Using Inspect Source I checked the CSS that affects the Message boxes & noticed that there are two different sources - I guess it just happens to be which one loads first.

 

As Chrome allows you to switch CSS elements on/off, there is a workaround but it's still irritating!

2 REPLIES 2
Highlighted
Level 6

Feedback - CSS Conflict on Invoice Input Page

In case this does get passed back to developers, the two css pages are...

 

Spoiler
BAD VERSION
/qbshared-lastmile-brazil-getting-paid-ui/1.4.0/styles/qbshared-lastmile-brazil-getting-paid-ui.css
/*!
* qbshared-lastmile-brazil-getting-paid-ui - v1.4.0 - 2019-10-16
* Copyright (c) 2019 Intuit Inc. All rights reserved. Unauthorized reproduction is a violation of applicable law. This material contains certain confidential and proprietary information and trade secrets of Intuit Inc.
*
*/
...
.universal .messagesAndAmounts textarea.customerMessage, .universal .messagesAndAmounts textarea.memoText {
width: 100%;
height: 30px;
}

& the good version...

Spoiler

Good Version
/transactions-ui/14.5.2/styles/transactions-ui.css

/*!
* transactions-ui - v14.5.2 - 2019-11-25
* Copyright (c) 2019 Intuit Inc. All rights reserved. Unauthorized reproduction is a violation of applicable law. This material contains certain confidential and proprietary information and trade secrets of Intuit Inc.
*
*/

...
.universal .messagesAndAmounts .customerMessage {
height: 86px;
width: 350px;
resize: none;
}

notice the height/widths of the blocks are completely different.

 

If you use Chrome Inspect to switch one off, the other takes effect.

Highlighted
Moderator

Feedback - CSS Conflict on Invoice Input Page

Hi paul72,

 

Since your concern requires deeper investigation and confirmation, our developer can assists you with this.

 

You can let the engineers know about this scenario by posting your concern through this link: https://www.developer.intuit.com/app/developer/homepage.

 

From there, they can test some coding and tools to use to get this sorted. You can also get an answer from one of the experts handling software integration, development, and other related concerns. 

 

Thanks for dropping by the Community. Please let me know if there anything else you need. I'll be here to help. Have a good day.