About CS420 Assignment 1
CS420 Assignment No 1 for Fall 2026 is from Web Development for Portable Devices. It covers lesson 3: Building Fluid Designs, Fluid Layouts, Blog Layout, Fixed Viewport Width, Set Viewport Width, Making it Fluid, Use Fluid Layouts, Flexbox Introduction, Flexbox Compatibility, Fluid to Responsive Design, carries 20 marks and is due on VULMS by 11:59 pm on Monday 9 November 2026. You can request the solution from this page.
- Course
- CS420 Web Development for Portable Devices
- Assignment
- Assignment No 1
- Semester
- Fall 2026
- Lesson
- 3: Building Fluid Designs, Fluid Layouts, Blog Layout, Fixed Viewport Width, Set Viewport Width, Making it Fluid, Use Fluid Layouts, Flexbox Introduction, Flexbox Compatibility, Fluid to Responsive Design
- Total marks
- 20
- End date
- Mon 9 Nov, 11:59 pm
What CS420 Assignment 1 asks
This assignment requires the development of a mobile-first home page for a community library portal named Library Link. Students must implement a responsive design that functions across mobile, tablet, and desktop devices. The project involves using viewport settings, fluid dimensions, Flexbox, and JavaScript to create an adaptable interface. You must produce a single HTML file containing all necessary HTML, CSS, and JavaScript code.
-
1
Part A – Page Setup Requirements
Create a single webpage titled Library Link that includes the correct viewport meta tag for portable devices. The design must follow a mobile-first approach. The header must feature the library name or logo, a tagline, and a hamburger menu icon.
-
2
Part B – Navigation and Content
Implement a navigation menu with Home, Books, Sessions, Notices, and Contact links, using JavaScript to toggle visibility on small screens. Create an introductory section with a heading, text, two action buttons, and an image. Additionally, include an Upcoming Reading Session section containing a title, description, date, venue, and image, ensuring all content uses Flexbox for vertical stacking on mobile and side-by-side alignment on wider screens.
-
3
Part C – Responsive Design
Ensure the layout uses fluid widths, percentages, or viewport units to prevent horizontal scrolling on mobile devices. You must include at least one media query to display navigation links horizontally and hide the hamburger menu on wider screens. Do not use CSS Grid, floats, absolute positioning, or external frameworks like Bootstrap.
- What to submit
- One .html file containing all HTML, CSS, and JavaScript code.
- Topics covered
- Mobile-first design Viewport meta tag Flexbox Media queries JavaScript DOM manipulation Fluid layouts
A summary of the assignment file, Fall 2026_CS420_1.docx. Download the file for the full wording before you start.
Lesson covered
The questions in this assignment come from this lesson. Read it in the CS420 handout before you open the assignment file, then practise it with the MCQs and past papers.
Solution
The solution has not been added yet. Request it from the download box and it will be added to this page, usually within a day.
Before you submit on VULMS
- 1 Start on the questions in the assignment file now. The solution will be added to this page once it is written.
- 2 Write the final answer in your own words. VU checks assignments for copying, and copied work gets zero marks.
- 3 Save your answer in the file type the assignment file asks for, and name it with your student ID, for example BC260012345.
- 4 Open the file once more to check it is not empty or corrupted, then upload it on VULMS before 11:59 pm on Mon 9 Nov.
Questions about this assignment
When is CS420 Assignment 1 due?
Monday 9 November 2026 at 11:59 pm. VULMS does not accept files after the deadline.
When will the solution be added?
Most solutions are up within a day of a request. Requests tell us which ones to write first, and 0 students have asked for this one so far.
Can I submit the solution as it is?
No. VU checks assignments for copying, and copied work gets zero marks. Use the solution to check your method, then write your own answer.
What file do I submit?
The assignment file says which file type to upload and lists any extra instructions from your instructor. Name the file with your student ID before you upload it on VULMS.