PDA

View Full Version : Help - Upgrade doesn't have Responsive Style


hiker
05-21-2012, 11:14 PM
I just upgraded to vb 4.1.12 over the weekend and to my surprise I don't have the Responsive Design / Template / Style or whatever you call it. My uploaded images will not adjust to the width of the browser. I'm really depending on this since I installed Everywhere Sidebar and have it visible in my threads so there's less room for the 800px wide images.

Now I need to scroll horizontally to view the whole image.

Can somebody tell me how to set my design as Responsive? It's strange, I had this working during the test phases but somehow have turned it off.

Oddly enough, when I preview my post before I publish, it's responsive, I can adjust the width of the browser and the image adjusts. But once I save and publish, it's no longer responsive.

Here are some screenshots. There's the photo, then the previewed post, then the published post where the right side is cut off.

https://vborg.vbsupport.ru/external/2012/05/26.jpg

https://vborg.vbsupport.ru/external/2012/05/27.jpg

https://vborg.vbsupport.ru/external/2012/05/28.jpg

Lynne
05-21-2012, 11:30 PM
It's a CSS issue and is therefore impossible for us to make suggestions without a link to the problem.

hiker
05-22-2012, 01:36 AM
Thanks for the reply, here's an example link:
http://www.bogley.com/forum/showthread.php?63304-I-fell-into

Which CSS template would you suggest I look at?

Lynne
05-22-2012, 03:57 PM
Try something like:
div.attachments {
width: 100%;
}
div.attachments img.attach {
height: 100%;
width: 100%;
}

hiker
05-22-2012, 05:29 PM
Thanks again Lynne, but can you tell me exactly where to place that code? On what template or sheet?

borbole
05-22-2012, 06:10 PM
Place it at the additional.css template.

hiker
05-22-2012, 06:37 PM
OK that's almost there! Now it's works for the "attached" images that appear below the post text, but not the attachments added inline via the "Insert Image" method.

The link above, has images added via Attachment Manager and that is working now: http://www.bogley.com/forum/showthread.php?63304-I-fell-into

But I'd also really need this same concept to work on the "Insert Image" inline images, example here: http://www.bogley.com/forum/showthread.php?63320-Bluejohn-Canyon_East-to-Main-loop_May-19-2012

Thanks so far for the help, I just pasted that code at the bottom of the additional.css template.

--------------- Added 1337751543 at 1337751543 ---------------

Any new ideas for the inline images? I just need to know what the css term is. Thanks

Better yet... what is the post preview css file called? Since the inline image width is responsive there, maybe I can just copy the code in that css sheet and add it to the additional css?

Thanks.

EDIT: Nevermind, found it. Added this to the additional.css:

blockquote img {
max-width: 100%;
}