Streaming live at 10am (PST)

Css grid Think you have what it takes?

Hello everyone my name is Corvox and I have been deigning sites since 1993, I have a desire to get back into developments. Here is my first nights attempt at going from a PSD design to a HTML and CSS website.

Working with CSS grid reminds me of the way we used to design and develop sites in the 90’s with tubular data. Tables and frame etc.

I could use some help though.

I design the sites to be 1600px in width with unlimited Height while designing the site.

I created a 16 column grid that will be 68 rows at 100px each unit.

I figured this would allow me to visualize my design into how I need to lay the grids out.

My Staging site is staging.412mediadesign.com here you can see my results.

I am pleased at my first attempt.

How ever now after designing what I have, I noticed it’s not full width.

My questions are.

  1. can I fix this to full width with out needing to change each grid object?
  2. Is there a better and more standard way for me to achieve what I want?

I have noticed some elements were in full screen and I had to do small and tiny hacks (well I kept tweaking till it went into place on my screen).

My next question is for Mobile.

  1. the mobile site repeats the hero image vertically. How can I stop that?
  2. the mobile site is off on a few segments of the design. How can I fix that?
    3.Again the width I assume would had fit the screen since I design everything at 1600px wide. But its only feeing up roughly half the screen on an Iphone 7

My next question is.

If one is doing all this by hand with notepad++ (lets put it this way, my syntax errors were obsolete using and tags, dated me to a piece of software!) is there anything other then https://codepen.io/pen/# that might allow me better visual aids from Desktop>mobile views?

I have not been part of development of sites since you coders made things so difficult, now the CSS grid is around, I feel its my time to start learning development again.

Any feed back is welcome, and please remember if you change my code, comment the HELL out of it, so I can learn from what you did, and others can teach me what you did wrong and why.

I am a self taught man, have learned a lot and forgot more then most have learned.

In 12 hours I got this far with design and coding of this site. But I can not learn it alone any longer, since it takes me more time to search for an answer I do not know I need yet.

So lets learn and teach each other during my struggles.

Should say use of font and center tags dated me to a piece of software lmao

As you can see I used DIVI to get a basic design going then gave myself 14 days to get a responsive mobile friendly design made up using the rough DIVI layouts.

So any help is welcome for this old dog, who still learning new tricks!

Welcome to the Webflow forum!

Do note that this forum is for websites/projects created in Webflow only.

Could you please edit Screenshot_2017-08-16_140811 and provide ALL the necessary details including your project read-only link in your post so we can take a look at your project?

In future if you want faster replies and more accurate answers, I suggest including all the details listed in the link above before someone has to ask.

Hope to hear from you soon. Thanks!