Solved

Need help fixing divs and css

Posted on 2014-03-13
4
212 Views
Last Modified: 2014-03-26
So I am working on a web page and I am having issues with the main page.  I would like for the width to be 100% across the screen but I am having some issues adjusting the page for smaller screens.  On my screen that is about 17.5" and 1920 x 1080 resolution it looks fine, but that is not the case with smaller screens and different browsers then the one I am using.  Any suggestions on fixing this?  Thanks!
0
Comment
Question by:VBBRett
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 4

Accepted Solution

by:
Rodrigo Munera earned 167 total points
ID: 39928445
I've been using bootstrap for a while and bootstrap 3 and grid layouts are a really great way of adapting your site to be responsive to multiple screen/device sizes.

For your issue, I would use a class container-fluid to achieve 100% fluid full screen on your main container and then use columns to break up the interior columns into working parts.

http://getbootstrap.com/css/#grid
0
 

Author Comment

by:VBBRett
ID: 39928501
Great, thanks!  You have an example in code?  I was trying to replicate the Teslamotors.com design but not completely.
0
 
LVL 58

Assisted Solution

by:Julian Hansen
Julian Hansen earned 167 total points
ID: 39928554
Personally I prefer foundation http://foundation.zurb.com/

Not so different from Bootstrap that choice comes to more than personal preferance - but just so you know there is something out there
0
 
LVL 52

Assisted Solution

by:Carl Tawn
Carl Tawn earned 166 total points
ID: 39928826
All the tesla site has done is a standard 100% width wrapper div, with a content div inside with its min-width property set. That allows the page to stretch horizontally to match the browser, but restricts it to being a minimum width to support the content.
0

Featured Post

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

617 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question