This job is to revise existing CSS for responsive columns of a section of a web page.
The basic layout is already correct, but it gets messy due to overflow at some widths.
The section is hosted as a template at [login to view URL]
You can copy that to your own Codepen, or move it to your own system.
However, you must show me your result at Codepen for approval before payment.
For the top area of the page, you will have to
- change the width breakpoints to those listed below
- remove the screen orientation media query from line 216 of the CSS
- add containers for the text so that it stacks and wraps exactly as shown in the mockup images.
- improve the spacing and alignment of the rows and columns, so that they transition cleanly at breakpoints and appear proper at any width.
- preserve all the scaling, colors, hovers, fonts, etc.
- do not change any CSS above the section marked /* contact code start */.
- remove any extraneous or unnecessary CSS code
- improve specificity of CSS rules so that all !important properties may be removed. (You must acknowledge this requirement in your bid to be accepted.)
You do not need to ensure compatibility with IE, Opera, or other minor browsers.
The following are the desired width breakpoints and the description.
(Also refer to the mockup images attached, but do not use them as a pixel-accurate reference since browser renderings will differ.)
1st heading "Contacts", one column icon, text unstacked
2nd heading "Documents", same
two headings, two columns icon, text stacked
two headings, two columns icon, text unstacked
two headings, four columns icon, text stacked
two headings, four columns icon, text unstacked
Above 1920px, the elements' scaling and positioning should be locked, while white space on sides expands to keep the arrangement [login to view URL] Logos area at the bottom of the page is also mostly working, as follows:
two rows of logos
one row of logos
However, you must ensure the logos are spaced evenly across the rows, at every width up to 1920px, where their scale and positions should be locked, while white space on sides expands to keep the arrangement centered.
19 freelanceria on tarjonnut keskimäärin %project_bid_stats_avg_sub_26% %project_currencyDetails_sign_sub_27% tähän työhön
Having 10 years of exprience in web developement and 5 stars rating on all previous projects(100% completion ratio) i am here to give you the best quality job and also best support and on time project.
Hi there, Consider it as done. I have read your full requirement and pictures. Able to fix all css issues. Ready to start right now. Waiting for your reply. Thanks, Shafayat