• For a reason I cannot discover, our blog has lost all the formatting around its images. Specifically, the captions have lost their formatting (typically bold and italics) and the grey boxes that typically buffer the borders have disappeared. I still see these elements in my editor, but they have disappeared on the front end.

    https://www.zionadventures.com/ZBlog

    Can anyone help? Seems like a .css issue, but I haven’t messed with .css since it happened…

    Thanks!
    Nick

Viewing 5 replies - 1 through 5 (of 5 total)
  • you have a destroyed style here in 2010style.css of twenty ten:

    #entry-author-info h2 {
    	color: #000;
    	font-size: 100%;
    	font-weight: bold;
    	margin-bottom: 0;
    
    .entry-utility {
    	clear: both;
    	color: #888;
    	font-size: 12px;
    	line-height: 18px;
    }

    the closing curly bracket } is missing from the top style.

    Thread Starter nawilkes

    (@nawilkes)

    Wow. Awesome. Please excuse my enthusiasm…

    Okay, so that totally worked. My question, if you’re willing to entertain it, is: How did you “see” that problem from the outside and know that that style was the problem? I really want to be able to do this. Is this something that takes years of training, or something specific I can learn about in a book or tutorial? Any insight would be highly appreciated.

    Thanks,
    Nick

    something specific I can learn about in a book or tutorial?

    no books there – ‘a little practice does a lot of good’

    with display problems of your kind, the stylesheet is the first suspect;
    (in other cases i would run the html validator https://validator.w3.org/ to check for invalid nested divs)

    the rest is experience – over time, i have seen many cases where a mistake in the stylesheet blocks the execution of styles further down – this is not unique to your problem.

    i use firefox web developer add-on with its ablity to tweak the styles (and more) in real time in the browser.

    then it is down to making a copy of the style that is blocked, and inserting it somewhere higher up into the stylesheet, to see if that brings the formatting back. and working the way down until the style is blocked again – narrowing down the lines of styles until the typing error is found.

    at other times i copy the style into dreamweaver with its syntax highlighting, which sometimes indicates the broken line.
    or i use the https://jigsaw.w3.org/css-validator/ – again, this sometimes gives an indication of the broken area.

    Thread Starter nawilkes

    (@nawilkes)

    Alchymyth,

    Thank you for your tips. I have been exploring Web Developer on Firefox, and can see it offers a tremendous wealth of tools and information. It is a bit overwhelming, but I am going to dig into it. I really appreciate folks like you who offer a bit of advice to those of us who are learning.

    Best,
    Nick

    you are welcome,

    i am glad that i could help ??

    “Give a man a fish; you have fed him for today. Teach a man to fish; and you have fed him for a lifetime”—Author unknown

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Grey Box and Caption effects lost on Images’ is closed to new replies.