Steven Zahm@ jack
Being responsive is the responsibility of the theme. Plugins that add content to a page via shortcode can, at best, use fluid layout designs. Responsive designs are based on screen size. The screen size will define which CSS rules are applied. Since Connections templates are in a page the available width is determined by the available content width of the page defined by the theme’s CSS and not the screen size. So applying CSS rules based on screen size can be problematic. cMap does contain a few rules that are applied on small screens such as smartphone … but for those rules to be effective, it is being “assumed” that the theme is going to do the right thing and make the page content width the width of the screen. Ok, so what does this have to do with images…
The default image width is 300px which is less than the portrait width of current smartphones so there is no reason to force the width of the image to be smaller. Ok, so what about on large screens, you can make the image larger right? Technically yes, I could use some CSS for a larger screen and swap in the larger image. But … what is the width of the page content, you can’t get that value with CSS. So a larger image could break the layout without knowing the page content width. Now, javascript could be used to get the parent container width, however, that itself presents another whole set of challenges with solutions that may or may not work depending on the current theme.
With all that said, the current method is for maximum compatibility.
Not sure I see the CSS issue you want addressed. Both sites look the same with the exception of of the font-family and the color of the link text. My suggestions are if you’re using page caching and/or cloudFlare, make sure you flush the cache and also flush your browser cache to make sure you’re loading the latest version of the CSS file.
Hope that helps.