wowgetoffyourcellphone Posted March 11, 2016 Report Share Posted March 11, 2016 Wildfiregames.com does not seem to render good on Chrome mobile. Only bad part is links at top of page. Thank you. 1 Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 12, 2016 Report Share Posted March 12, 2016 Look like a problem with CSS style, may be the menu is sticky to same position or the other possibility is don't have its own space. May be given a look in devs mode. Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 12, 2016 Report Share Posted March 12, 2016 (edited) I found the first problem. the padding and the height, I'm not familiar with "em" display : black? can be ... these codes give an idea isn't have a properly mobile version in the HTML. the HTML can call CSS style in some cases. Edited March 12, 2016 by Lion.Kanzen Quote Link to comment Share on other sites More sharing options...
GunChleoc Posted March 13, 2016 Report Share Posted March 13, 2016 Em is a size unit relative to the font size, roughly the width of the letter "m". 1 Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 13, 2016 Report Share Posted March 13, 2016 (edited) The em haven't great difference in this matter. Because you can use px= pixels. I'm more familiar with that. The padding CSS Padding Properties The CSS padding properties are used to generate space around content. The padding properties set the size of the white space between the element content and the element border. http://www.w3schools.com/css/ Edited March 13, 2016 by feneur Removed distracting formatting Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 13, 2016 Report Share Posted March 13, 2016 (edited) http://www.w3schools.com/css/css_display_visibility.asp display... The display property is the most important CSS property for controlling layout. The display Property The display property specifies if/how an element is displayed. Every HTML element has a default display value depending on what type of element it is. The default display value for most elements is block or inline. Edited March 13, 2016 by feneur Removed distracting formatting Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 13, 2016 Report Share Posted March 13, 2016 (edited) Ok, now have more questions... the white text is fine, because is a head or header. Is a menu. but the dark text invades the space. the white text are stalled/fix in that proportion :1em im try to remember my multimedia class, my teacher warning to us about these situations. especially with fix/stall ...and the use of CSS code in PC vs use a mobile version. About dimensions. http://www.w3schools.com/css/css_dimension.asp Setting height and width The height and width properties are used to set the height and width of an element. The height and width can be set to auto (this is default. Means that the browser calculates the height and width), or be specified in length values, like px, cm, etc., or in percent (%) of the containing block. Edited March 13, 2016 by feneur Removed distracting formatting Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 13, 2016 Report Share Posted March 13, 2016 (edited) now I can compare, with my PC browser (Firefox). the head works fine... I will have a look to a HMTL... the HTML looks some basic at this point. Spoiler it do not have many conventions code like "lang" or meta <meta charset="UTF-8"> <html lang="en-US"> http://www.w3schools.com/html/html_headings.asp Quote Declaring a language is important for accessibility applications (screen readers) and search engines. Omitting <html> or <body> can crash DOM and XML software. Omitting <body> can produce errors in older browsers (IE9). Edited March 13, 2016 by Lion.Kanzen Quote Link to comment Share on other sites More sharing options...
GunChleoc Posted March 13, 2016 Report Share Posted March 13, 2016 (edited) 6 hours ago, Lion.Kanzen said: The em haven't great difference in this matter. Because you can use px= pixels. I'm more familiar with that. Everybody is more familiar with px, but it is bad practice to define sizes with pixels, because it makes it harder for the user to change. For example, if I can't see very well, I might want to make the fonts bigger - if fontsize is defined with px instead of em, ex or %, this gets much harder, especially if I'm using an old browser. Of course, margins and paddings aren't that important for legibility Edited March 13, 2016 by GunChleoc Quote Link to comment Share on other sites More sharing options...
feneur Posted March 14, 2016 Report Share Posted March 14, 2016 The links should now display even on smaller screens. It's not a perfect solution (as it takes up a bit more screen space than necessary, the address bar does disappear when you scroll down anyway, so it's not as bad as it might seem from this screenshot), but it works, and we didn't feel like redesigning the web page at the moment. We will keep it in mind for the future though. Quote Link to comment Share on other sites More sharing options...
implodedok Posted March 15, 2016 Report Share Posted March 15, 2016 On 3/12/2016 at 10:33 PM, Lion.Kanzen said: I found the first problem. the padding and the height, I'm not familiar with "em" display : black? can be ... these codes give an idea isn't have a properly mobile version in the HTML. the HTML can call CSS style in some cases. I'm sorry to be rude, but you have no idea what you are talking about. :-) Display block (not black) is perfectly valid. It is in fact the default display style the div element. Setting it makes other elements behave like div's do. And as noted above, 'em' is a very valid unit of measurement. It is relative to the font size used on the page. Meaning, if the user configures a larger font in their browser, the whole page scales accordingly. For accessibility this is recommended. There were two problems, both fixed. One was that the element that contains the logo & menu, had a fixed height. Since the elements inside it are floated, they can float outside the height of the element. The height was removed and an element was added below that clears both left and right. That solves that. That added the problem that whenever the elements are compressed and take up more space, the height of header increases, but the content keeps the same top margin, thus falling under the header element. I fixed that by giving the content a top margin depending on browser width. On 3/11/2016 at 2:22 AM, wowgetoffyourcellphone said: Wildfiregames.com does not seem to render good on Chrome mobile. Only bad part is links at top of page. Thank you. Thank you for letting us know! :-) 1 Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 15, 2016 Report Share Posted March 15, 2016 Sorry I mean block, but just I can't editing that, Im not sure why. For me isn't important I don't use mobile version but I have some class about create webs but isn't my strong point as designer, only I share my knowledge. Quote Link to comment Share on other sites More sharing options...
implodedok Posted March 15, 2016 Report Share Posted March 15, 2016 1 hour ago, Lion.Kanzen said: Sorry I mean block, but just I can't editing that, Im not sure why. For me isn't important I don't use mobile version but I have some class about create webs but isn't my strong point as designer, only I share my knowledge. I create websites and web applications for a living. :-) Keep up the good work. 1 Quote Link to comment Share on other sites More sharing options...
Lion.Kanzen Posted March 16, 2016 Report Share Posted March 16, 2016 20 minutes ago, implodedok said: I create websites and web applications for a living. :-) Keep up the good work. Yeah, I suppose that, the team select very well their staff. 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.