css positioning problem

by 7 replies
8
Hello,

I have one small problem with my css.

I have positioned the text on a website using css position and everyhting seemed to be fine untill i viewed the site on a smaller screen with a lower resolution

the text was in the middle of the screen.

what can i do to make it stick one the same positon on the website no matter what resolution you use on your screen?

thanks a lot in advance for all the help


Best
#website design #css #positioning #problem
  • Sounds like you have a lot to learn about HTML & CSS. The only advice I can give is to try making one big division that contains the whole page and set its width to the size you want with auto margins on the left and right side to center that box. Then it will look the same on all screen resolutions.
    • [1] reply
    • Check out Lynda dot com for some good training videos. Or search around you tube. There are certain tags you must place your text in to control where it goes. Such as <div id=". Look around for a basic CSS layout. Should consist of

      • Wrapper tag - Box that holds header and footer
      • Header tag - inside wrapper tag
      • Sidebar tag
      • Body tag
      • Footer tag - close your wrapper tag.
      Once the simple layout is put together you can then use css rules to manipulate each tag.

      Hope I was somewhat helpful there are many other people who can explain this much better
  • Give some more details...like the site you're working on and the css...(that is, if you want help).
  • add a <div> and wrap all the content of your site with this div. i.e <div id="pagewrapper">
    <div id="header"></div>
    <div id="left"></div>
    <div id="mid"></div>
    <div id="right"></div>
    <div id="footer"></div>
    </div>
    in this way your text will adopt relative position of wrapper div <div id="pagewrapper"> and stay in position.
  • you can use wrappers on your div so that it will follow the Resolution of your sytem.
  • div and wrap are the words that mostly come across in CSS and should be aware of basics. w3schools can get you more information about basics.
  • Hi Batistaa, css positioning can be very tricky, especially with mixed absolute/relative positioning, but its cake once you understand how parent element positioning affects the child position..

    I'd suggest adding a "position:relative" attribute to your absolutely positioned div's parent container. This will set the absolutely positioned div's x/y coordinates relative to the parent container, not the browser window.

    Once you do this, you might need to reset the absolutely positioned div's X/Y position since it will likely be much different once you set relative to the parent.
    Hope that helps!
  • Banned
    [DELETED]
  • Banned
    [DELETED]
Join the discussion

Next Topics on Trending Feed