HTML, CSS, Positioning and resolutions -


so working on project friend/client , having trouble setting page works on resolutions, example if opens website on 1680 x 1050, 1920 x 1080 or in between or higher page work of elements move nor re-size. client opened page on laptop , navigation bar had created half off screen. here pictures computer , his.

picture computer (1680 x 1050) - http://gyazo.com/fa2fc9ee489c7059f8ba50e97057ce93

picture laptop - http://gyazo.com/2fe8652be408925ce7a322a1638cfed8

<style> .btn { width: 200px;} .fixedbtns { position: absolute; margin-left: -250px; margin-top: -150px; } .textleft  { text-align: left; border: 0; margin: 10px;} .relative  { position: relative; } #container { width: 400px; position: relative; } </style> <h2>our services</h2> strategy 4 growth offers variety of business consulting services  organisations have not achieved growth ambitions , / or capabilities  , can assist clients specific strategic analysis, advice, leadership  , strategy implementation , review. in case services offered  tailored meet specific customer requirements contain  elements of individual services listed here.  <div class="fixedbtns">[button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section1"]business growth strategy[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section2"]operating model strategy[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section3"]digital strategy[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section4"]it strategy[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section5"]cloud strategy[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section6"]business transformation[/button]  <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section7"]uk / emea market entry strategy[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section8"]business process outsourcing (bpo)[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section9"]sales , marketing strategy[/button] <br> [button color="red" size="small" light="yes" icon="" open_in_new_window="no" link="#section10"]strategic planning[/button] 

here code, being done within wordpress page text editor, doing of css buttons internally easier edit.

.fixedbtns { position: absolute; margin-left: -250px; margin-top: -150px; } 

don't absolutely position things or causing them unresponsive , strange on various screen resolutions - , in case span off screen because of -250px part.

rather, responsive web design.


Comments

Popular posts from this blog

searchKeyword not working in AngularJS filter -

sequelize.js - Sequelize: sort by enum cases -

user interface - how to replace an ongoing process of image capture from another process call over the same ImageLabel in python's GUI TKinter -