Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
I am not good with HTML. But yes I can understand it well.
I faced a scenario where there was a HTML page with header,footer and many page elements on it.When the page was displayed in browser all the elements would go haywire on resizing the browser window.
The solution that was finally given was putting elements in <div> tag and then hit-and-trial with margin-top attribute for a dozen of elements on the page.I found it clumsy way of solving this issue.
How can the positioning of HTML page elements be handled in such scenarios in a graceful manner?What can be a good approach while WEB page design so that it looks as it is supposed to irrespective of the size of browser?
I think you must check out responsive web design. Head over to the links below and you can get what you want:
http://www.labnol.org/internet/responsive-web-design-faq/21361/
http://googlewebmastercentral.blogspot.in/2012/04/responsive-design-harnessing-power-of.html
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
Below are examples of the page source from both sites. I am on chrome if that means anything. My Questions is, why do these two sites look so differently from each other? Why does Facebooks source look the way it does, paragraphs and paragraphs of code with no formatting compared to stack overflow where tags and elements are distinguishable from each other?
Does it serve a purpose for it to be shown the way it looks on facebooks website? I assume that's not how it was formatted in development but done that way after loading it to the site?
**Here is an example of Facebooks source code from the landing page**
**Here is an example of Stack Overflows source code from the landing page**
Not necessarily. Majority of the code is on the server side anyway so you can't see majority of the code for both websites. However, Facebook's code has been minified. This means the code has been scrunched together to take up less space so that the site will load faster.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I'm new to HTML and CSS and I don't know any other web languages. 2 Questions:
When my website (zarwanhashem.com) is accessed using a different resolution than the one it was made on the header area at the top isn't filling up the page and the text is going beyond it as well. I didn't have this issue at first. Why is it messing up? Also, I'm not sure if you can see my CSS from inspect element.
The footer I created isn't showing up. It was working fine last night and I honestly have no clue what changed that made it stop working now. It isn't showing up.
Let me know if you need any other details. Thanks for the help.
your footer is inside a misclosed comment <!--footer-> instead of <!--footer-->
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
Hello I am building a webpage that consists of tables, its been successfully built, but the only problem is that when my page is uploaded, the way it looks varies on different screens, so i am trying to have a fixed size using css, so that my page looks unique on all screens, this is what I have tried
style="height: 100%;", for my tables and body tag
But it makes my page not to scroll, but the content and images are looking terribly stretched. can anyone suggest what I can do to have a well looking webpage that would come out uniquely on all webpages
Read on how to use the <div> tag in combination with CSS. Much easier to design your homepage using the <div> tag rather than <table>. Also it will help you when you need to make layout changes for your homepage in the future.
Give elements a fixed width rather than percentage to avoid stretching.
More ideally, look into learning media queries.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
I am developing a Wordpress website where I needed the logo to overlap the banner image below.
Through the help of a colleague as well as Stack Overflow users I now have two solutions that allow for my layout to render as intended.
The image in the banner is rendered as a background image. Because this is a Wordpress site I will have to use inline css for this. Link.
The nav and the banner below are positioned absolutely. Link.
Problems with solution #1:
I realized that if the image is rendered as a background image it will be less SEO friendly and of course less user-friendly for screen readers, etc. as it won't have alt or title tags.
Problems with solution #2:
I find that absolute positioning just doesn't feel as reliable cross-browser (this could be all in my mind). This method also required some extra markup and css classes which I didn't like having to do.
Which way do you think is better? For what reasons?
I don't think there is a definitive answer to your question.
But bear in mind that if you want to print your page, the background image will not be rendered, but the absolute image will.
in my opinion: you should ask yourself if this image is part of the content in your web site, or just a nice visual style.
if its part of the content: use absolute positioning techniques, otherwise: use background.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I essentially want to be able to scale the entire site (images, elements, the whole sha-bang) to what ever browser size window the user is using. Anyone have success doing this and would be willing to share how?
I'm using HTML 5 by the way.
You need to start thinking about sizing your elements using percentages instead of pixels.
Take a look at this simple example and it may help you on your way. Good luck.
http://jsfiddle.net/hACbn/1/
Take a look at using responsive layouts:
Here's a half decent framework to get you started
http://gridpak.com/