jackwilsdon Posted August 1, 2012 Share Posted August 1, 2012 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/ Share on other sites More sharing options...
Mahngiel Posted August 2, 2012 Share Posted August 2, 2012 what's with the enormous title? Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366290 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366366 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366369 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366370 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366390 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? Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366391 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366394 Share on other sites More sharing options...
Jessica Posted August 2, 2012 Share Posted August 2, 2012 12em! :o Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366396 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366414 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. Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366418 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! Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366421 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 Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366426 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. Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366430 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? Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366432 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? Link to comment https://forums.phpfreaks.com/topic/266564-my-personal-site/#findComment-1366433 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.