1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Invisible table with image in notice

Discussion in 'Styling and Customization Questions' started by Phillip, Mar 31, 2012.

  1. Phillip

    Phillip Active Member

    I want to include a simple invisible two column table in a notice with 4 pixel padding. The first column will have a small image and the second column will have the text of the notice. I created this in standard html, but the table for some reason is visible in IE8 even though the border is set to 0.

    If anyone can help, it would be most appreciated.
     
  2. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

  3. Phillip

    Phillip Active Member

    Much appreciated Jake. This got me going in the right direction.

    One more though... What code would I use to put a square box around the same image in a notice just like on the member avatars shown to the left of posts?

    Thanks man!
     
  4. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    You can use more inline styling to get the desired effect:

    Code:
    <div style="float: left; width: 50px; margin-right: 10px; background-color: red; padding: 10px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px;">
    	<img src="path/to/image.gif" />
    </div>
    
    <div>
    	TEXT ON THE RIGHT
    </div>
    
    That will give you a nice rounded box around the image.
     

Share This Page