WordPress.org

Support

Support » Themes and Templates » How to make background work on text widet

How to make background work on text widet

  • I’m using an older theme and was able to make it work somehow with the current wordpress version. However, I’m having trouble fixing the text widget. If i add a text widget, it doesn’t seem to show the background. You can see the screenshot here

    What can i do to make it work so the background image i use for widgets will show properly for it? thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • esmi

    @esmi

    Forum Moderator

    Try using Firefox with the Firebug add-on for this kind of CSS troubleshooting. Or use whatever developer tool is available in your web browser.

    I see the following code. The side bar has category widget and text widget

    <div id="sidebar">
    
    <ul>
    <li id="categories-4" class="widget widget_categories">
    <h2 class="widgettitle">Categories</h2>
    <span class="top"></span>
    </ul>
    <ul>
    <li class="cat-item cat-item-1"><a href="http://mywebsitename.com/blog/archives/category/uncategorized" title="View all posts filed under Uncategorized">Uncategorized</a>
    </ul>
    <li id="text-8" class="widget widget_text">
    <h2 class="widgettitle">Text Widget</h2>
    <span class="top"></span>
    <div class="textwidget">This is a text text text </div>
    
    <strong>and this is the css style for the sidebar:</strong>
    #sidebar {
    	float:left;
    	margin-left:30px;
    	display:inline;
    	position:relative;
    	top:-75px;
    }
    
    #sidebar ul li h2 {
    	background:url(images/titleTag.png) no-repeat;
    	width:166px;
    	height:71px;
    	padding-top:25px;
    	display:block;
    	position:relative;
    	z-index:100;
    	margin-bottom:-60px;
    	font-size:23px;
    	color:#B23D80;
    	padding-left:20px;
    }
    
    #sidebar ul li .top {
    	display:block;
    	background:url(images/listTop.png);
    	width:240px;
    	height:90px;
    	position:relative;
    }
    
    #sidebar ul li {
    	background:url(images/listBtm.png) bottom left no-repeat;
    	width:240px;
    	display:block;
    	padding-bottom: 27px;
    }
    
    #sidebar ul li ul {
    	position:relative;
    	background:url(images/listRpt.png);
    	width:100%;
    }
    
    #sidebar ul li ul li {
    	background:url(images/star.gif) 30px 5px no-repeat;
    	line-height:30px;
    	border:0;
    	padding:0;
    	position:relative;
    	top:-30px;
    }
    
    #sidebar ul li a {
    	color:#a6431c;
    	text-decoration:none;
    	font-size:16px;
    }
    
    #sidebar ul li a:hover {
    	color:#908d2c;
    }


    [you must use the code buttons when posting code]

    the same thing happens when i add like the calendar, the background image doesnt show. any suggestions on what i can do to fix it?

    WPyogi

    @wpyogi

    Forum Moderator

    It’s really not possible to help with CSS without seeing the site live, so a link to your site would be the best way for someone to be able to help you.

    Sorry, here’s the link to the test site. See the calendar and text widget on the sidedar

    [Note: You’re going to have to wait patiently for support here. That’s a compromise when using a free support service. If your issue is urgent then consider using a paid service.]

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to make background work on text widet’ is closed to new replies.
Skip to toolbar