Responsive Website in Webflow Part 7

all right our final section i want to

just check out how things look for our

sign up

so far we have our tablet mode

we no longer need these

border radius because we want to expand

everything we might want to hide these

brands as well

on specifically on tablet and below so

we could hide

tablet hide we don't need that one and

on these ones we also want to hide these

specifically on tablet so we can hide

them as well

there we go so it's just a little bit

cleaner so that when the user comes into

a laptop version here

we don't need to actually see the access

all right so

for this section we don't actually want

to have these

ex this spaces between we don't want to

have this to be 100 ph

so what we can do is we can remove

the vh on this particular section

again we can remove the uh we can add a

class

uh landscape auto height so we had a

landscape auto height but we

need to create one for tablet so tablet

auto height now that will

have auto and that will push

everything out so that the section is

going to be 100 percent of whatever the

container has this looks good right now

and then go into landscape the image

background

on that box might want to try to scale

it down right now it was a

cover i'm wondering what would happen if

we start changing that to

contain contain it's gonna it's gonna

grab that image and try to fit it within

so we don't want that one we want to use

continues in cover

but maybe we can change the position of

where those

patterns start we can play around with

the position of the cover image

and that looks pretty good to me again

we go down to mobile

and now this is where we start hitting

some some issues

the primary issue here is the input

field because the input field

has a fixed uh a minimum width that

we've established on

the desktop view so this input field

we're going to change that to zero

so that it matches the size of the

parent okay

but we actually want to expand this just

a little bit

that's a bit too much so baby 280

right about there is where we want to be

so 280 minimum pixels for those input

fields

and that's about it all right guys so

this is it for now

i just wanted to go over the little

break the different breakpoints and how

do we start thinking about

adjusting the layout so that it matches

and works well

all of this of course will will require

you to polish up some of the

some of the structure but my goal in

this particular

course the ability to create utility

classes along

in different breakpoints without having

to create so many names

and classes i'm super excited i hope you

guys are

too of building this streaming platform

website

let's jump into one of the most exciting

parts of this whole project

is animations and interactions so i'll

see you on the next module

‍