Felipe Ramalho Posted July 15, 2013 Share Posted July 15, 2013 I would understand. How do I get an image if Auto Fit to Screen! Source html and Css... Link to comment Share on other sites More sharing options...
niche Posted July 16, 2013 Share Posted July 16, 2013 (edited) Percentages. EDIT: With you height and width properties Edited July 16, 2013 by niche 1 Link to comment Share on other sites More sharing options...
Felipe Ramalho Posted July 16, 2013 Author Share Posted July 16, 2013 Percentages. EDIT: With you height and width properties Example Okay got% using leave Picture Adjustable Computer screen. But I could not do it aligar in the center! Need an Image Aligned Center - TOP I tried to use that background-position: center; Unlike my Language and Send Me Your Source to Comment if possible. Alignment Img must be Made in html or css? Link to comment Share on other sites More sharing options...
niche Posted July 17, 2013 Share Posted July 17, 2013 Please post your code using the code tags. Based on your example, I'd use the padding property. Link to comment Share on other sites More sharing options...
Felipe Ramalho Posted July 17, 2013 Author Share Posted July 17, 2013 Please post your code using the code tags. Based on your example, I'd use the padding property. Html <html><head> <link rel="stylesheet" href="style.css"></head><body><div class="img"> <img src="logo.png" width="100%" height="100%"></div> Css div.img{margin:2px;border:1px solid #0000ff;height:20%;width:10%;float:left;text-align:center;} So I'm doing it is centralized, easier method would? Making this CSS Way div { margin: 2px; border: 1px solid # 0000ff; height: 20%; width: 10%; float: left; text-align: center; } This was not to be centered also because of the content DIV in html css has this as herença. So the img inside the DIV html should inherit Style Send me the Code the way you use. Link to comment Share on other sites More sharing options...
davej Posted July 17, 2013 Share Posted July 17, 2013 (edited) <!DOCTYPE html><html><head><title>Felipe</title><style>img{width: 75%;}div.img{text-align: center;}</style></head><body><div class="img"> <img src="logo.png" alt="logo"/></div></body></html> Edited July 17, 2013 by davej 1 Link to comment Share on other sites More sharing options...
Felipe Ramalho Posted July 18, 2013 Author Share Posted July 18, 2013 hanks so much and helped me lot. Even so I needed! Thanks for the trouble Link to comment Share on other sites More sharing options...
davej Posted July 18, 2013 Share Posted July 18, 2013 (edited) I am not in the habit of using percentages. They seem to often work over a certain small range and then the rounding errors cause them to fail. Perhaps someone here can explain how to do this in the best possible way. <!DOCTYPE html><html><head><title>Percent Felipe</title><style>div#header{height: 60px;text-align: center;background-color: #6666ee;border: 1px solid black;margin: 1px 0;width: 100%;}div#envelope{border: 1px solid black;float: left;width: 100%;}div#menu{width: 15%; /* troublesome */height: 600px;background-color: green;float: left;border: 1px solid black;margin: 1px;}div#main{border: 1px solid black;float: right;margin: 1px auto;width: 83%; /* troublesome */height: 600px;background-color: #8888ff;text-align: center;}img{width: 95%;margin: 50px auto;border:8px solid blue;}footer{height: 40px;text-align: center;background-color: #6666ee;border: 1px solid black;margin: 1px 0;width: 100%;float: none;clear: both;}</style></head><body><div id="header"><h3>This is the header</h3></div><div id="envelope"><div id="menu"></div><div id="main"> <img src="http://i.imgur.com/GbguM.png" alt="logo"/></div></div><footer><h3>This is the footer</h3></footer></body></html> Edited July 19, 2013 by davej Link to comment Share on other sites More sharing options...
lovewebdesign Posted September 7, 2013 Share Posted September 7, 2013 you can learn something about responsive web design. It's a kind of solution to be compatible for all the devices Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now