Support » Fixing WordPress » Page link styling

  • Hello all.

    I started using WordPress a few days and I’m liking it a lot already. There’s just one thing that’s been bugging me for these few days, and that is those boring plain text links.

    So here’s the scenario:
    I printed the page links using <?php wp_list_pages(); ?>
    I tried to style them by placing a div class around it
    Obviously when I tried to place a nice little background-image behind it, the image got behind the whole div.

    So my question is: how can I style my page list in such a way it only styles the actual links and not the whole thing.

    Thanks in advance!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Try using Firefox with the Firebug add-on for this kind of work. Perhaps you just need to add the image to the list elements?

    Thread Starter eXtreaL

    (@extreal)

    Alright, I fixed it using ul divs. Never worked with those before, so it was kind of hard to figure out.

    Now I’m facing another problem: the alignment of the links. I tried to align the links to the left but they won’t go fully to the left.

    Here’s a little example:
    http://i56.tinypic.com/nqe4oj.png

    And this is the CSS I’m using

    ul#nav {
    	height:25px;
    }
    
    ul#nav li {
    	list-style:none;
    	float:left;
    	line-height:25px;
    	padding:0 10px;
    	background-image: url(images/button.png);
    }

    Whereas “ul#nav” is the container and “ul#nav li” is the style of the actual buttons

    I hope you guys can help me out. Thanks 🙂

    browsers have default values for the margin and padding of unordered lists; you might need to set these to zero in your styles;

    http://www.w3schools.com/css/css_list.asp

    Thread Starter eXtreaL

    (@extreal)

    Oh right, that worked out perfectly! Thanks a lot!!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Page link styling’ is closed to new replies.