SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS positioning problems

    Having a problem with positioning using stylesheets on a website I'm developing. At resolution 1024x768, the page looks perfect. However, when you minimize it or resize it, all the images and menus and stuff get all jumbled together. Does anyone know how to keep the positioning set so that it doesn't move when you resize the screen? The link to the page is http://www.krayzieland.com/barneschi...mplateLine.php if you'd like to see the source code. To get at the problem, just ignore all the javascript code thats there. Any help would be greatly appreciated. Thank you.

  2. #2
    The short answer is yes... Herbster's Avatar
    Join Date
    Oct 2001
    Location
    Bay City, Oregon
    Posts
    715
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK. You are using class temp for the table that holds line.gif. .temp defines a right and a bottom margin and as I resize the browser, those margins hold. Nothing to prevent it from moving off the top or left of the screen. Am I close?

  3. #3
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're right, the positioning of line.jpg was from the bottom. Making it from the top fixed the problem of its positioning. However, the menu on the left will move when you resize the window and scroll up and down. While this is a cool effect, how do I get rid of it?

  4. #4
    The short answer is yes... Herbster's Avatar
    Join Date
    Oct 2001
    Location
    Bay City, Oregon
    Posts
    715
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    line.gif is holding position at the bottom of the screen but it still slides off the left side if I resize horizontally.

    The menu was doing fine - staying in one place - while I resized vertically. When I clicked the browser border to resize horizontally it vanished... Don't know what that is.

    IE 5.5 @ 800x600

  5. #5
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, I have that same problem here. Any ideas of how to get rid of these issues?

  6. #6
    The short answer is yes... Herbster's Avatar
    Join Date
    Oct 2001
    Location
    Bay City, Oregon
    Posts
    715
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by krayziepjf
    However, the menu on the left will move when you resize the window and scroll up and down. While this is a cool effect, how do I get rid of it?
    That's buried in coolmenus3.js

  7. #7
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You say the moving of the menu is due to code that I have in that .js file? If that is so, I will dig into that on my own.

    However, how can I make it that line.jpg is centered on the page but stays at its absolute centered position when the window is resized? I don't want it running off anywhere when the window is resized. I just wanted it to stay at its place when the window is resized. I would use simple html to do this, but i need the z-indexing to overlap image and text layers.

  8. #8
    The short answer is yes... Herbster's Avatar
    Join Date
    Oct 2001
    Location
    Bay City, Oregon
    Posts
    715
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If we are talking about the same thing, yes - it would be in the js file.

    Your large graphic is 800px wide.
    line.gif is 583px.
    Have you tried setting left to 108 or 109?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •