How to set where the page starts

Discussion in 'CSS' started by mberman84, Nov 5, 2008.

0
  1. #1
    basically what i want to do is add a navigation bar to the top 27 pixels of my website. the nav bar is called with a JS function and works all by itself.

    however, sometimes when i add it to certains sites..the CSS of the site will mess with the nav bar css.

    what i want to do is display the nav bar in the top 27 pixels...and then start the rest of the site directly below those 27 pixels. i dont want the nav bar to interact with the site in any way.

    how do i do this?
    __________________
     
    mberman84, Nov 5, 2008 IP
  2. justinlorder

    justinlorder Peon

    Messages:
    4,160
    Likes Received:
    61
    Best Answers:
    0
    Trophy Points:
    0
    #2
    There are many ways to solve the problem. However you don't give enough information.
    I can fix it for $ 10. Let me know if you are interested .
     
    justinlorder, Nov 5, 2008 IP
  3. garrettheel

    garrettheel Peon

    Messages:
    341
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    0
    #3
    You're unclear in the post.. why not just use css properly and set different css for the top menu instead of some silly workaround that you're looking for
     
    garrettheel, Nov 6, 2008 IP
  4. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #4
    From the small information you have given I guess one solution could be wrap the JS in a DIV like:

    <div id="menWrap">Javascript goes here</div>

    Then inside the CSS you would add:

    #menwrap { height:27px;width:100%;position:absolute;top:0;left:0;}

    Then if you don't already have the 27px gap you would also add:

    body {margin-top:27px;}

    There are better solutions than this, which use no positioning, if you just have it in the flow of the doc i guess but can't tell.
     
    wd_2k6, Nov 6, 2008 IP
  5. mypsdtohtml

    mypsdtohtml Guest

    Messages:
    96
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #5
    to set where the page starts just set the margin of your CSS to margin-top:0px;
     
    mypsdtohtml, Nov 6, 2008 IP
  6. mberman84

    mberman84 Peon

    Messages:
    511
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #6
    the site is barackobamajokes.com

    Code:

    <body style=" margin: 27px 0px 0px 0px;">
    <div id="menu" style="position: absolute; top: 27px; height: 20px; left: 6px;">
    <script language="javascript" type="text/javascript">
    <!--
    var nlSiteName = 'Barack Obama Jokes';
    var nlSiteURL = 'http://www.NationalLampoon.com';
    var nlWidth = '100%'; //set by %(percentage) or px(pixels)
    var nlMarginLeft = '0px'; //set by px(pixels) only
    var nlMarginRight = '0px'; //set by px(pixels) only
    var nlVertical = 'humor';
    var nlTextColor = 'FFFFFF'; //color of text in bar
    -->
    </script>
    <script src="http://www.nationallampoon.com/nlhat/nlbar.js" type="text/javascript"></script>
    </div>

    I put this directly before the <body> tag. I left the bar up (not working properly) so you can see what i mean.

    thanks!


    PS.... the bar should look like it does on nationallampoon.com
     
    mberman84, Nov 6, 2008 IP
  7. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #7
    That's not what you want. What you've done is told the browser to first make 27 px available at the top (with the 27px top margin on the body) which is fine, but then you say, start the menu 27px from the top (of the body, the default when there is no positioned ancestor).

    Try:
    <div id="menu" style="position: absolute; top: 0px; left: 6px; height: 20px; width: 100%;">
    in IE6 you might have to also specifically list left: 6 and right:0 to get it to span all the way across the page. Absolute boxes will shrink wrap if you don't set a width, like floats do.

    Of course, I have a very LOW opinion of javva-da-junked menus, or javva-da-junk spoiling lovely clean HTML but that's just me. : )

    You'd better get the obamabile.gif on that site.
     
    Stomme poes, Nov 7, 2008 IP