Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Nenad Jovic
7,883 PointsCan someone help me out to create HTML Table
Hello,
Can someone help me to create HTML table like this one http://prntscr.com/5epa52 It's my assignment, and i'm not really sure how to make it like this exactly the same.
12 Answers
Wayne Priestley
19,579 PointsHi Nenad,
I tried all day to get this exactly as it appears in the screenshot, i even started to think someone had given you a photoshopped image LOL.
This codepen is as near as i could get for you.
You'll have to take a good look through the code, I pretty much started from scratch in the end as it was easier than forever changing things about.
I separated the html and css into two files, I've linked the css to the html so everything should be good to go.
Hope this helps.
Wayne Priestley
19,579 Points
Matthew Orndoff
9,018 PointsYo Wayne, that's a god-tier link. Good find.
Wayne Priestley
19,579 PointsNo probs Matthew, I use that site for most things i want to know.
Matthew Orndoff
9,018 PointsHey Nenad,
So I created an approximation of the first section of that table for you, because it's an assignment I think you should try to figure out the rest. I think that example gives you a good start.
From what I can tell you're going to need to do a lot of colspans to make the table work. The MDN documentation on the table element and its related elements are going to be your best friends on this one.
Hope that helps. Good luck!
Wayne Priestley
19,579 PointsHi Nenad,
Can you post your code into Codepen please so i can take a look.
Nenad Jovic
7,883 PointsThanks Matthew, I really appreciate it! I will play with it now.
Nenad Jovic
7,883 PointsThanks Wayne, I will definitely check it out and explore more deeply! :)
Nenad Jovic
7,883 PointsMatthew i managed to create table like one i need for assignment but still don't know how to make this following places same like on pic http://prntscr.com/5fmmri http://prntscr.com/5fmn0y
Nenad Jovic
7,883 PointsCan someone help me out?
Nenad Jovic
7,883 PointsHi Wayne,
I don't have subscription there, is there any other alternative which is free?
Wayne Priestley
19,579 PointsIts fee, just click the new pen button at the top of the screen, once you have pasted your code just copy the url from the address bar and paste it here.
Nenad Jovic
7,883 Points
Wayne Priestley
19,579 PointsHi Nenad,
Sorry for the wait, I fixed the gap at the end of the row, I have to get some work done for a friend before tomorrow. So i'll get back to your code in the morning okay.
here is my codepen.
Nenad Jovic
7,883 PointsSure, I need it for next week in anyway that's the deadline to proceed with my assignment, so it's fine take your time and thanks for helping me out! :)
Wayne Priestley
19,579 PointsHi Nenad,
Here is where i am so far codepen, as you can see there is one row that i can't seem to get right. Whenever i try to extend it to the end of the table the rows containing web and fax move out of position.
Will try again later.
Nenad Jovic
7,883 PointsHey Wayne,
No problem man, thanks for your time!