jackwilsdon Posted August 1, 2012 Share Posted August 1, 2012 (edited) Hey, I'm Jack. I would like someone to review my personal site, as I coded it myself, and I would like to learn any downsides to how my code works, and if there is anything wrong with this code. I see it a 'learning exercise', to better myself at JS/HTML/CSS. The URL of my site is [link] Thankyou! - Jack PS: I know the 'paragraph' was unnecessary, I just wanted to put it Edited December 24, 2015 by requinix removing malicious link Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 what's with the enormous title? Quote Link to comment Share on other sites More sharing options...
jackwilsdon Posted August 2, 2012 Author Share Posted August 2, 2012 Too much free space, and I wanted the title to fill the full width of the box. If you are talking about it when it was outside the box, it was due to a CSS bug, it's fixed now Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 it's not fixed. http://i.imm.io/yZxk.png Quote Link to comment Share on other sites More sharing options...
floridaflatlander Posted August 2, 2012 Share Posted August 2, 2012 it's fixed now no it isn't Quote Link to comment Share on other sites More sharing options...
jackwilsdon Posted August 2, 2012 Author Share Posted August 2, 2012 Can I see a screenshot where it's going outside the box please, and also can you tell me which browser(s) / OS you experience this on? Thanks Quote Link to comment Share on other sites More sharing options...
jackwilsdon Posted August 2, 2012 Author Share Posted August 2, 2012 it's not fixed. http://i.imm.io/yZxk.png That seems to be due to a bug in my CSS, where it loads fonts. What OS / web browser are you using? Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 it has nothing to do with a bug and everything to do with this (12em = ~192px ) for the record i'm on FF14.0.1 Quote Link to comment Share on other sites More sharing options...
Jessica Posted August 2, 2012 Share Posted August 2, 2012 12em! :o Quote Link to comment Share on other sites More sharing options...
jackwilsdon Posted August 2, 2012 Author Share Posted August 2, 2012 I think I've fixed it. Moved it back to the old 160px. I changed to EM because I read somewhere online that it was better Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted August 2, 2012 Share Posted August 2, 2012 Em is 'better' for fluid and responsive sites because its size is dependent on the browser's font size (an em is equal to the size of a lower case 'M'). Usually, 16px = 1em. There are sites out there that allow one to do pt to px to em conversions. Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 still, 160px is far too damned large man. your body is limited to 800px of width. I just floated your header to escape the body constraints... it's 1575 pixels lol. that's nearly twice your body constraint! Quote Link to comment Share on other sites More sharing options...
jackwilsdon Posted August 2, 2012 Author Share Posted August 2, 2012 How do I work out the correct text width for the body? PS: Thanks for this help Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 I like to use firebug with FF (chrome has other tools, like firebug lite) to do my styling in order to make sure everything is the way i want it to look. Adding a hidden overflow, and justifying the text, the maximum font size in px that fits your given width for that font is 81px. http://i.imm.io/z0nA.png To note on using EMs. your constant constraints makes it almost pointless from what I understand on their usage. Since your pages will be tightly controlled, scaling is going to be out of context here, as a regular page zoom will suffice. Where EMs shine is when you have a fluid page where dimensions of the screen viewer come into play with the ratio of the body and text. Quote Link to comment Share on other sites More sharing options...
jackwilsdon Posted August 2, 2012 Author Share Posted August 2, 2012 When I change the font size of the h1 tag to 80px, it looks like this: http://i.imgur.com/GBTnZ.png . I've also left it as 80px on the live version. EDIT: When editing it with chrome's version of firebug, the font size has to be 150px to fit. Is your browser showing the correct font? Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 i justified the font as well. Check that you're not zoomed at all. what's your browser? are you using any browser prefixes? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.