I am not able to think in HTML&CSS

I am not able to think in HTML&CSS
0

I have completed all the sections of Responsive Web Design except the projects. The reason that I am taking my time for the projects is because I don’t want to submit just any noob like project. I want to take my time and make a decent one then submit. The problem is that I am not being able to think in the terms of html and css. I am getting stuck in issues like fitting an image into a parent div container, making something come to center of the screen. It is not the case that I have not wholeheartedly covered the practice sections on fcc, I have done so and even made notes from each section. It’s been 8 days since I covered all the theroy sections of FCC and still I have just no clue how to make things. :frowning_face:

Your experience, any solution you found to somewhat the same problem,any path you recommend to me, any book etc. are very welcome. :smile:

3 Likes

Both of these are things that many people who have been using CSS for a long time end up having to Google, don’t sweat it. Those two things there: you can put either into Google and get good answers back immediately from Stack Overflow or CSS Tricks or wherever, you know what questions to ask so you should be fine. If that’s the level of issue you’re having, well, you can just look the answers up, so not sure why this would be an issue.

6 Likes

Well, that comes as something very easy to you but is not for me. I am already using css tricks and stack overflow.

I learned CSS ~10 years ago. As one example I’ve used flex since before it was widely available in browsers, and it still takes me hours of googling and fiddling to stop certain types of responsive images collapsing to nothing when I put them into a flax/grid layout. Honestly, 8 days is a minute amount of time, expecting to even remember a tiny amount of what you’ve learned recently is not reasonable.

6 Likes

This is just the case for beginners, @_govindrathi its a normal thing, just take your time, and google things you find confusing out. Don’t feel bad when a style you applied doesn’t work. its a normal thing for beginners, since they said that

THE BEGINNING IS ALWAYS THE HARDEST.

its not a must that you will start right away with the FCC projects, you can start by just building simple projects like

  • A nav bar : This will help you understand some layout concepts .
  • Giving your divs different background colors.
  • Try adding hover states to some elements, e.g Nav bar, button
  • Styling your button element : this will enable you know how some css properties like border-radius, color, padding, etc. works.

The little projects will enable you have a practical hands on the css properties rough play.

One thing you have to know is that you don’t have to aim at writing elegant codes for now, what you need is codes that gets the work done. Make mistakes, its normal. the mistakes will enable to you to figure out how different properties work in order to know when and when not to use them. As it is said

PRACTICE MAKES PERFECT

Don’t relent in practicing new stuffs everyday. play and mess with styles, they will help you more, then with time you will understand the concepts. It took me two months to learn css, then, i was telling myself that immediately i finish learning css, i will start building sophisticated and rugged web projects, but after that two months, whenever i approach a css problem, my brain goes completely blank since i don’t know where to start, this depressed my spirit a lot till i learnt that i have to start climbing the ladder from the bottom and not the vice versa. I tried it and it worked.
So my guy, start climbing the ladder from the bottom and not the vice versa.

NEVER GIVE UP !! YOU CAN DO THIS

11 Likes

During those 8 days, how many templates have you tried to build?, you mentioned you don’t want to submit any noob like projects, but keep in mind that you are just starting out, and you will need to start with noob like projects at some point.

Theory is good, but you can easily feel overwhelmed with HTML and CSS properties, only with time you realize you don’t need to memorize most of these properties, but as a beginner you can’t help but to worry about it. Besides, if you don’t put the theory into practice (especially when you are just starting out) it’ll be hard for you to retain all the information.

My advice? Build at least 4 to 5 templates using HTML and CSS, start with simple things, then as you progress try to build more complex layouts. Once you feel confident with laying out templates, make them responsive, all of them. This is the best way to retain the information in my opinion.

By the way, if you don’t have programming background, 8 days is not really that much time, so don’t rush it, take your time.

4 Likes

First of all a big THANK YOU for taking your time out and writing this for me :innocent:. I just loved the way to motivated me here and have literally realized that I was climbing the other way round. I find your advice of building up small chunks really useful. From now on I’ll work on them.

Cheers!
p.s. : If you are okay with it, I just wanted to ask if there is any social media where I can reach up to you :grin: .

Well Thank You! Yeah! I have kind of realized that I am rushing up too much.:sweat_smile:

  1. trial & error. many times i didn’t go with the theories. and just try everything that possible. it may takes more times but for me it works many times.
  2. copy&paste. many will be disagree. but with this you can learn about how many things work and can modify it as you want.
  3. take your time. sometimes things can go easier with a fresh mind.

well i am also still a beginner and don’t have many experience but maybe those things can help.

2 Likes

This is actually quite normal as CSS is the tool that is easy to learn and use, but pain in the neck to apply. I’ve heard that even senior developers of more than 10 years of experience have trouble of using CSS and they simply google up. Since you’ve been only for 8 days, it’s too early to call quits. Personally, it took me 1 month of practice to grasp its basics and I’m keeping my browser tabs open just for references.

Though I may be only a noob, my advice for you is to create a dummy website and copy your code to it. That way, you can play around HTML and CSS to your heart’s content without worrying of messing up your main project.

It is putting two birds in one bowl! (stop hurting birds) :blush:

3 Likes

Mah dawg! You just fueled my motivation tank with some grade A advice, I know it was meant for the other guy here, but my damn, you just gave me a blueprint to focus on major shortcomings!

Much love!

happy coding bro ! :laughing::smile:

Yeah bro, happy coding. Am sorry, i deserted all social media for now in order to concentrate on learning coding, but you can reach me through my email here [email protected] . All the best.

I have buy this book https://www.amazon.co.uk/Book-CSS3-Developers-Future-Design/dp/1593272863
I am not sure why is so expensive on amazon in SR from12-16,5 eur.
before this book I was thinking the grid is old from 90’s and after the book the grid is the future.
Center with margin anything 50% or 50 wh.

img{
height:100%;
width:100%;}
1 Like

Hi fellow newbie and coding brother,

first of all: don´t give up! I started HTML and CSS a few months ago and I feel you! Here my advice:

  1. First of all, start coding! Like mentioned before, it doesn´t have to be huge projects, just load down a fucking text editor and start playing around! For me it really started, when I downloaded the “Brackets” text editor and played around with every new piece of information I found
  2. Use lots of different learning ressources. There is more than free code camp (although they are great, especially the forum). There are also free courses on codecacademy, W3schools, free videos on udemy and of course, youtube tutorials… Just try different perspectives and find out, what works best for you. Also, it is like walking in circles. Sometimes you just don´t get it. But then you come back later and suddenly everything makes sense.
  3. Give yourself time!
  4. Connect with your fellow students! If you lose courage again come back to the forum :wink:

All the best on your journey, you have what it takes!

Marcella

4 Likes

@_govindrathi I started the code camp stuff with some knowledge, and so breezed through the html/css stuff because I had already learned it. It wasn’t until I got about halfway into the javascript stuff before I realized that a lot of the code camp stuff is better thought of as exercises and challenges, rather than fully developed “learning” type materials. In other words, I mean that it seems better for checking/rehearsing your abilities rather than gaining them in the first place.
I’d recommend taking some online classes that are devoted to the subject. You’ll get a more through explanation about a lot of the concepts. At least that’s been my experience working through the code camp javascript stuff, which definitely feels like makes some pretty extreme leaps of logic between exercises. You can find plenty of good (and sometimes free!) html/css classes on youtube, etc. I liked Brad Hussey’s classes, but there are lots of others that are good too. I had a lot more fun with it doing that. No need to be discouraged!

2 Likes

The problem you’re facing isn’t about you can’t think in HTML and CSS. It’s about your insecurity of getting started because the problem you are facing right now is the same problem which everyone faces when creating something for the first time because it is one thing to learn from a course and it’s another to use or apply it. And the thing is you are going to fail and somewhere your mind will say to quit it. But the only thing that could stop you from Quitting is you and that would make you a good developer who won’t stop until his or her work is completed and that is the main difference between a great and a bad developer.

And the problem you are facing belongs to the learning process isn’t it,you learn from your mistake and not repeat it next time. So, think it likewise that you aren’t able to “fit an image into a parent div container” YET but now, you know several ways how an image couldn’t be fit into parent div container.

So, my only advice is to get out of your insecure zone and make as many mistakes and learn from it and not repeat those mistakes again. And Best of Luck for your project.

2 Likes

Then you’re doing the right thing.

I’ve been coding HTML and CSS for decades now, and even I still am constantly opening up Google to look up and refresh my memory on syntax or even find a tip on the best way to do something. A lot of all this is just trial and error, as I’ll set something up in code and then sit on Chrome Developer Tools (“Inspect”) and tweak until I’m happy with my result.

“Thinking HTML and CSS” is more about staring at a layout (Photoshop, XD, Sketch, etc) and thinking about how you would make it into the clearest most semantic code you can. I usually start with putting all the elements into the page, then styling those elements to match the layout design, then adding in any bells, whistles, animations, etc.

Don’t be impatient. My first sites back in the late 90s looked cheap and amateurish…and we really didn’t have the benefits of CSS! I’m sure even now I’d have some say my stuff looks great and others say it looks “blah” or “outdated” in some way. I’ve only found you should mainly worry about doing what’s right for the client. Keep at it, and it’ll come easier…like riding a bicycle or learning a musical instrument.

Just bear in mind that one cannot know perfect syntax on everything instantly. Even many skilled professionals lament on how whiteboard interviews are not ideal because even then will often go to Google to reference syntax and best practices.

3 Likes

My two cents on this are that I think you should aim for the basic requirements, fulfill them, then turn them in and put them up here for people to look at and help you, and then move onto learning more things. I think you might be falling into the creative trap of infinitely trying to make your projects better. People have pointed out that getting started is one of the hardest things, and I think this is true, but I think that it can be just as hard to stop once you get going. You’ll probably never be satisfied with the end result, but you will also learn a very important lesson about software development; good software isn’t made in one night, it is an iterative process that you have to start, stop, finish, and come back to it later. It’s like when you’re writing a paper and the next morning (or mourning in some cases) you come back and proof read it. There are also lots of useful things you could potentially be learning in the time you’re spending on making it perfect; you may find that when you revisit these projects months from now because you just have that itch to make it better, you might completely scrap the whole thing but keep that one idea you liked and make a better project with the new things you’ve learned.

1 Like

Hi Govindrathi,
Don’t worry, first of all, I must congratulate you for your push having been able to finish with the theory part is a great success already. Now, this is not a problem that you are facing alone. So many beginners face problems like this and even worse. You see, given the number of lessons you have to take before the projects like where you are now, it’s normal not to remember everything like fitting an image into a parent div container, making something come to the center of the screen. Moreso, there exist just so many tags and elements in HTML and CSS that you might not be able to recall all of them. Therefore from my personal experience, the best way of getting good at all of this is actually applying what you have learned and can recall in projects like those FreeCodeCamp has provided us with. Its important you complete the projects first. You might have most of the issues your face addressed before you even complete the projects. Also, I am glad you are part of this community where if you are stuck at any point do not hesitate to share with us and you will always get a way out. Making use of search engines like google is and also should be a very important part of our lives as developers. So I urge you not to feel discouraged at the start but know that there is always a solution for every problem. And being a part of a community like this makes you as well part of those outsourcing solutions to problems.

1 Like