Indie-Resource.com

Posted: **Sat Aug 31, 2013 3:02 pm**

Hey guys

With me knowing some jquery i kinda fell in (probably a mistake) using it for almost everything.. even positioning elements in the webpage.

I like to make websites that fit every resolution. My screen is a 22'' 1920x1080 screen and so i can see everything in a website, but other people might not have such screen so we need to think about them.

So my min-resolution policy is 1024x768. I don't care if you have to scroll down to see more content, but i do care if you have to scroll horizontally, that just can't happen...

What i do is something like:

CSS:

Code: Select all

#content
{
position: absolute;
top: /*header height so it fits together */;
}

jQuery

Code: Select all

function Position()
{
$("#content").css("left", $(window).width() / 2 - $("#content").width() / 2); //center the div
}

$(window).resize(function()
{
Position();
});

This works very well.. but is this all necessary? Is there a more efficient way to position divs right?

Btw, i use this when i don't want to specify a width for a div, if i did specified i could just do a margin-left: auto and margin-right: auto and it would be centered.

Posted: **Sat Aug 31, 2013 3:30 pm**

If you just want to make your site fit the width, you can use the old table tag. Sure some may argue that tables design are bad (bla bla, what looks good and work on most browser is ok), yet they are easier to do:

<center><table width='50%'><tr><td>Hello content</td></tr></table></center>

Don't worry about deprecated center tags or whatever. That will work for a good amount of time still.

Posted: **Sat Aug 31, 2013 4:09 pm**

Why did you used width: 50%? Only 50% of the screen will be used?

But yeah tables suck a little xD

*inspect element*

Code: Select all

<table id="tbl1">
   <table id="tbl2">
    <table id="tbl3">
     <tr>
          <td>
              <table id="tbl4"><h1>Content</h1></table>
         </td>
     </tr>
    </table>
   </table>
</table>

*this designer is crazy*

You know what im saying?

Posted: **Sat Aug 31, 2013 5:32 pm**

That's certainly NOT how I would do it

But 50% was to show that you can center it.

Posted: **Sat Aug 31, 2013 6:19 pm**

ahh right

My code was just a joke, but my friend once did a website and that was the code pretty much xD <tr> and <td> all the way.

Indie-Resource.com

Positions in Websites (CSS)

Positions in Websites (CSS)

Re: Positions in Websites (CSS)

Re: Positions in Websites (CSS)

Re: Positions in Websites (CSS)

Re: Positions in Websites (CSS)