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

Need some help with my sidebar..

Discussion in 'Web Design' started by iliketurtles, Sep 2, 2010.

  1. iliketurtles

    iliketurtles Regular Member

    Joined:
    Dec 10, 2008
    Messages:
    283
    Likes Received:
    10
    Home Page:
    I`d rather not give you the url to my site, but I use this theme: http://wp-extend.com/themes/drochilli/

    Now, can someone tell me how I can allign the content in my sidebar to the right? I want the "border" between black and white to be sort of a center..
     
  2. ElmosGotAGun

    ElmosGotAGun Newbie

    Joined:
    Dec 18, 2009
    Messages:
    18
    Likes Received:
    1
    Hi, Sorry i dont quiet understand what you want to do...

    Do you want the content in the sidebar to shift towards the right more?

    If you could clarify this, I would be happy to help...

    Sorry i didnt reply in the other thread, it wont let me :(
     
  3. iliketurtles

    iliketurtles Regular Member

    Joined:
    Dec 10, 2008
    Messages:
    283
    Likes Received:
    10
    Home Page:
    [​IMG]

    :)
     
  4. workinseo

    workinseo Registered Member

    Joined:
    Oct 7, 2009
    Messages:
    64
    Likes Received:
    179
    Location:
    Moscow, RU
    Add DIV near you sidebar output and write in it align.
     
  5. iliketurtles

    iliketurtles Regular Member

    Joined:
    Dec 10, 2008
    Messages:
    283
    Likes Received:
    10
    Home Page:
    <div align="right">

    content

    </div>

    ?

    That didn`t work when I edited the single.php. Did I edit wrong?
     
  6. veronica

    veronica Newbie

    Joined:
    Aug 30, 2010
    Messages:
    11
    Likes Received:
    0
    you shouldn't need to add any extra divs. the sidebar looks to be setup with menu tags like <ul> and <li>. Look in your sidebar.php and you should see something like this:

    <div id="aside">
    <ul>
    <li>menu item 1</li>
    <li>menu item 2</li>

    Either edit the css, or align that div right there as such: <div id="aside" style="text-align:right">

    That should do it
     
  7. iliketurtles

    iliketurtles Regular Member

    Joined:
    Dec 10, 2008
    Messages:
    283
    Likes Received:
    10
    Home Page:
    Works! Great stuff, thanks! :)
     
  8. iliketurtles

    iliketurtles Regular Member

    Joined:
    Dec 10, 2008
    Messages:
    283
    Likes Received:
    10
    Home Page:
    One more thing, I`d like for the textlinks in the sidebar to be underlined when I hover my mouse over them. Right now they are underlined all the time, and the underlining dissapears when I hover over them. How do I fix this?
     
  9. ElmosGotAGun

    ElmosGotAGun Newbie

    Joined:
    Dec 18, 2009
    Messages:
    18
    Likes Received:
    1
    Like this:

    Code:
    .widget ul li a{
    text-decoration:none;
    }
    
    .widget ul li a:hover{
    text-decoration:underline;
    }
    
    
     
  10. iliketurtles

    iliketurtles Regular Member

    Joined:
    Dec 10, 2008
    Messages:
    283
    Likes Received:
    10
    Home Page:
    Cool! Where should I put it? (Yes, I`m kinda lost)


    Aside
    */

    #aside ul {
    display: inline;
    float: left;
    font: 13px/20px Arial;
    list-style-type: none;
    margin: 0;
    width: 100%;
    }

    #aside ul li {
    color: #ffd700;
    float: left;
    margin: 0 0 10px 0;
    width: 100%;
    }

    #aside ul li ul {
    color: #fff;
    list-style-type: disc;
    margin: 10px 0 10px 20px;
    }

    #aside ul li ul li {
    background: none;
    margin: 0;
    }

    #aside ul li ul li ul {
    margin: 0 0 0 20px;
    }

    #aside a {
    color: #fff;
    }

    #aside h3 {
    color: #ffd700;
    font: bold 23px/26px Arial;
    letter-spacing: -1px;
    margin: 20px 0 0;
    position: relative;
    }

    #aside h3 span {
    height: 25px;
    margin-left: 5px;
    position: absolute;
    width: 22px;
    }

    #aside h3 a {
    color: #ffd700;
    text-decoration: none;
    }

    #aside ul li .textwidget {
    color: #fff;
    margin: 10px 0 0 0;
    }
     
  11. ElmosGotAGun

    ElmosGotAGun Newbie

    Joined:
    Dec 18, 2009
    Messages:
    18
    Likes Received:
    1
    This should do it

    Code:
    
    #aside a {
    color: #fff;
    text-decoration:none;
    }
    #aside a:hover {
    text-decoration:underline;
    }
    
    
     
  12. smooshie

    smooshie Newbie

    Joined:
    Dec 27, 2009
    Messages:
    18
    Likes Received:
    2
    perfect solution elmosgotagun. hey iliketurles, instead of just making it underline on hover, try 'n change the color of it to another color on your site, you might like it much better

    Code:
    #aside a {
    color: #fff;
    text-decoration:none;
    }
    #aside a:hover {
    color: #f00;
    text-decoration:none;
    }