WordPress.org

Forums

my menu bounces around? (14 posts)

  1. ILostMyDream
    Member
    Posted 10 years ago #

    I want to be able to make the menu and the content and everything else stay in one happy little box, probally around 700px wide. I've tried the rap and everything else, but the menu dosen't want to behave. it moves with the size of my screen and covers up everything.

    any ideas?

    thx :)

  2. philpeeps
    Member
    Posted 10 years ago #

    link?

  3. ILostMyDream
    Member
    Posted 10 years ago #

  4. dissurion
    Member
    Posted 10 years ago #

    #rap {
    width: 700px;
    margin: auto;
    border: solid #000 1px;
    background: white;
    }

  5. ILostMyDream
    Member
    Posted 10 years ago #

    hey thanks that worked great :) however I still can't position the menu? if i change the attributes of the menu position it just overlaps itself out of the box. when i don't put anything in for position, right, etc it stays inside of the box, however its under everything else.

  6. ILostMyDream
    Member
    Posted 10 years ago #

    oh i forgot... i want the menu in the box inbetween the header and footer. do i have to change the index.php settings?

  7. dissurion
    Member
    Posted 10 years ago #

    Inside your rap there are 2 main divs: the content (where the posts go) and the menu. There are a number of ways of solving to position them like you want.
    Your content now is:

    #content {
    margin: 0 0 0 0;
    width: 40em
    }

    I don't know how width 40em is, but I would leave some room for your menu, let's say about 200px. You can do this by changing it to:

    #content {
    width: 500px;
    }

    Your menu now appears below your post because it hasn't got enough room, and is styled as your rap is (with margin set to auto, which will position it in the middle). So to position it at the right side you can position it 'absolute' or 'float' it (or relative if you had put your menu first in the index file): float:

    #menu {
    background: #fff;
    border-left: 1px dotted #ccc;
    border-top: solid 3px #e0e6e0;
    padding-left: 20px
    padding-top: 10px
    padding-right30px;
    width: 175px;
    float: right;
    }

    If both content and menu don't overlap (which is something strange for me, since adding distances doesn't seem to work always) it will display side by side. If one of the two is displayed beneath, you'll have to narrow them. Also experiment with the padding and see what happens.

    Probably you should add a clear to your footer, the paragraph with class credit:

    clear: both;

    I'm not sure it will work from a paragrap to a div.

    ps: not sure whether I can check back for further questions before monday

  8. dissurion
    Member
    Posted 10 years ago #

    I forgot one thing: your menu is in your index behind the content, so it will start floating after it. Maybe it's easier to position it absolute: :)

  9. dissurion
    Member
    Posted 10 years ago #

    #menu {
    background: #fff;
    border-left: 1px dotted #ccc;
    border-top: solid 3px #e0e6e0;
    padding-left: 20px
    padding-top: 10px
    padding-right30px;
    width: 175px;
    position absolute;
    top: 100px;
    left: 500px;
    }

    play with the top and left (or right if you want) to position it exactly where you want. If you change the index to have the menu displayed first you can try to float or position it relative. :)

    You can even float your content to the left and your menu to the right (and make sure they don't overlap by giving them enough space).
    Your choice. :)

  10. ILostMyDream
    Member
    Posted 10 years ago #

    oh great thank you so much :) its all in the box! ha! you have made me a very happy woman ;) have a nice weekend!

  11. dissurion
    Member
    Posted 10 years ago #

    double posted somehow

  12. ILostMyDream
    Member
    Posted 10 years ago #

    and i promise it'll look better when its done... the disaster that is my blog is worse than my bed room at the moment ;)

  13. dissurion
    Member
    Posted 10 years ago #

    Pressing the analogy furhter:
    It's not the way your room looks like that makes it interesting. It's the content.
    :)

  14. ILostMyDream
    Member
    Posted 10 years ago #

    lol :)

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.