CODEWITHSUNDEEP
javascriptjquerywidthmargin
James Charless Dickinson
James Charless Dickinson

Reputation: 446

jQuery using outerwidth to set element width

Is there a way with jQuery that I can use outerwidth to get the width of an element from .entry 1 to .entry 6 (that doesn't have a width specified in CSS) and then have the container to be centered on the page?

Basically, I'm using a dynamic width for entries, but no dynamic width for the container they're in. This is so that when the user resizes their window (and for different screen resolutions), there is the most amount of posts per row possible. I want a script that measures the posts on the first row and sets the width of the div #content so I can use margin auto.

Example: here

Upvotes: 0

Views: 3069

Answers (2)

SpYk3HH
SpYk3HH

Reputation: 22570

//CSS // centers an object in its "relative" parent
.element {
     margin: 0 auto;
}

//JS // places outwidth of eleID1 as the width of eleID2
$(".eleID2").width($("#eleID1").outerWidth());

Upvotes: 1

AgnosticMantis
AgnosticMantis

Reputation: 716

With the javascript width functions (and jQuery equivalents) you always get the current widths , no matter if you declared it in css or not.

If i got you right, you could just loop over the 6 entries, add their widths together and move the container 50% from left and 50% of its own width back (It should be centered then).

Upvotes: 0

Related Questions