Grey Box and Caption effects lost on Images (6 posts)

  1. nawilkes
    Posted 5 years ago #

    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.


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


  2. Michael
    Forum Moderator
    Posted 5 years ago #

    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.

  3. nawilkes
    Posted 5 years ago #

    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.


  4. Michael
    Forum Moderator
    Posted 5 years ago #

    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 http://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 http://jigsaw.w3.org/css-validator/ - again, this sometimes gives an indication of the broken area.

  5. nawilkes
    Posted 5 years ago #


    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.


  6. Michael
    Forum Moderator
    Posted 5 years ago #

    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

Topic Closed

This topic has been closed to new replies.

About this Topic