Am I a retard for not being able to figure out .css?

I'm taking the courses over at TeamTreehouse....and CSS positioning is killing me too. It's really easy to get to the point where you're creating a website that looks like it came out of the 1990's, but getting to the point where you're fluently creating HTML5/CSS3 level websites with all the bells & whistles is going to take several years of experience.

My best suggestion, when it comes to positioning, is to first understand absolute positioning before moving onto creating responsive designs. I was trying to do both at the same time and wasted some serious time.
 


dmnEPC said:
Knowing how to layout divs is not a browser quirk
Click to expand...

I agree, I'm just lumping together all the arbitrary sort of knowledge that goes into web design.

I understand that on some level you have to know the details of how things work, but when it comes to HTML/CSS there is a lot of trivial knowledge that you can find tons of people blogging about and stuff, as if it's actually important and rewarding to learn. Contrast that with actual computer science or programming skills. Or actual design skills. Learning about data structures or design principles gives you real knowledge that you can use for a long time. Learning the details of some web framework or API is something you might need to do to get things done, but it's not rewarding.

That's why I like Bootstrap... CSS is essentially an API for web browsers, and idgaf about arbitrary and trivial knowledge, which pretty much all APIs are by their nature. I still have plenty of knowledge about how HTML and CSS work, because I've built tons of websites and written plenty of markup code by hand, but I never wanted that knowledge. Bootstrap just gives me an easier to use API, just like using jQuery when my calls to the built in DOM API are getting to messy.
 
pinchyfingers said:
I agree, I'm just lumping together all the arbitrary sort of knowledge that goes into web design.

I understand that on some level you have to know the details of how things work, but when it comes to HTML/CSS there is a lot of trivial knowledge that you can find tons of people blogging about and stuff, as if it's actually important and rewarding to learn. Contrast that with actual computer science or programming skills. Or actual design skills. Learning about data structures or design principles gives you real knowledge that you can use for a long time. Learning the details of some web framework or API is something you might need to do to get things done, but it's not rewarding.

That's why I like Bootstrap... CSS is essentially an API for web browsers, and idgaf about arbitrary and trivial knowledge, which pretty much all APIs are by their nature. I still have plenty of knowledge about how HTML and CSS work, because I've built tons of websites and written plenty of markup code by hand, but I never wanted that knowledge. Bootstrap just gives me an easier to use API, just like using jQuery when my calls to the built in DOM API are getting to messy.
Click to expand...

Agree with much of your reply. I only have one thing to add. The whole damn internet is built on the back of html/css. It is the foundation. It is the reason for most of the other programming language (a stretch?)

I could be wrong, but I think having a fundamental understanding of html/css is critical to understanding anything else you build on the web.

With that said, I have nothing against bootstrap, or other frameworks. But if you really want to get the most out of them, knowing html/css is the key. That doesn't even mean you have to 'know' html/css, you just need to know how to find the answers.
 
  • Like
Reactions: pinchyfingers
SUP3RNOVA said:
bootstrap is fugly

Foundation | The Most Advanced Responsive Front-end Framework from ZURB
Click to expand...

Thanks for your outstanding contribution to the conversation, even though Foundation was already mentioned. The fact is that all frameworks are generally ugly - basically naked UI elements that are meant to be prototyping tools. Onto which you add your own design, restyling all the elements in your own way to suit your purpose, and getting rid of those that you're not using.
 
[ame="http://www.youtube.com/watch?v=olHEykVL9t4"]Corky fights the power - YouTube[/ame]
 
SkyFire said:
Part of the reason your mind was blown might have been because there is no such thing as an inline float. Floating anything turns it into a block, regardless of being set to display: inline; or not. :yin-yang:
Click to expand...

For the Box Model it's just the opposite. A block element keeps its own row, no other element before and after; an inline element will stay on the same row together with other inline elements inside their container block until there is enough space, ok?
Now you float a block element to force more block elements to stay on the same row, to make a block behave like an inline.

To the OP:
Invest your time on a CSS preprocessor, I write my presentation code only with SASS + SUSY + COMPASS with scss syntax. SASS makes the dirty job to create perfect CSS code with all the vendors prefix hell. Save time and code rows.
 
-joe- said:
You got Firebug? I hated CSS too until I started using that, it's nice being able to play around and see the changes in real time.
Click to expand...

Firebug is a God gift for web developers/designers. I have been using it for years and I don't know the way to code without it. Quite better than Chrome developer tools and the only reason I still use Firefox.
 
For you Bootstrap and other framework users. When finished what is your go to method to strip out the thousand lines of css that you did not use? Any suggestions on a system that leaves you with just the css that you actually used in the html?
 
Uptime said:
For you Bootstrap and other framework users. When finished what is your go to method to strip out the thousand lines of css that you did not use? Any suggestions on a system that leaves you with just the css that you actually used in the html?
Click to expand...

I usually don't even bother. Bootstrap's minimized CSS is 111k and it's minimized JS is 33k. My customizations for most sites are another 35-40k usually. This way, if at some point down the line, I want to add a page that uses a component not already used on the site, say some tabs or something, it's there for me without needing to generate another custom build.

However, if you want to minimize things further, you can spin up a custom version with just the component you're using here...

Customize and download · Bootstrap

Or here...

Initializr - Start an HTML5 Boilerplate project in 15 seconds!
 
Fatbat said:
I usually don't even bother. Bootstrap's minimized CSS is 111k and it's minimized JS is 33k. My customizations for most sites are another 35-40k usually. This way, if at some point down the line, I want to add a page that uses a component not already used on the site, say some tabs or something, it's there for me without needing to generate another custom build.

However, if you want to minimize things further, you can spin up a custom version with just the component you're using here...

Customize and download · Bootstrap

Or here...

Initializr - Start an HTML5 Boilerplate project in 15 seconds!
Click to expand...

Nice find on Initializr. HTML5, BS, JS all in one. Will checkout.

The include only what you need approach with Bootstrap would have me re-building a lot because I left something out I think.

I'm not a designer and it hurts to try. I like the Bootstrap everything including the kitchen sink approach but would feel better if I could strip it down to the functional bare bones for the live version.

But yeah not worth spending much time on for a few k.
 
i know that feel bro. as much as I like php/python, mysql i hate working with css.

but then i used firebug, and starting to like it. :)
 
@ rusvik

I can feel your pain. I struggled teaching myself CSS for the past year off and on. Heard about codecademy ( free ) and took both their "make a website" and "html & css" sections. Got a good grasp on it now. Not an expert by any means.. but able to do the basics now.

Also go download Adobe's secret editor for html/css/javascript. Then go to the addons and get emmet. It will blow your mind!
 
You must log in or register to reply here.
Top Bottom