How can I get my two main elements to be right next to each other?

[wost]

I have two main elements on my page: .right and .left

.left has fixed position and an undetermined width, .right has 80% width (of the parent .wrapper’s 80%) and is currently floating right. How can I position these elements right next to each other?
The main inspiration for my page is this page: https://hugogiraudel.com/ and I want something like that for my own page.

This is my page: https://wostensen.github.io/new-new-new-personal-pagr/
This is the source: https://github.com/wOstensen/new-new-new-personal-pagr

[Paulie_D]

If the fixed position element is of undetermined width there is no CSS that will calculate the remaining with to position the right div since the left div does not affect the elements around it.

A minimal Codepen.io demo would be helpful but my initial thought is that you will need javascript.

That said Hugo’s left div is NOT an undetermined width…it’s % based and so a calculation of the remaining width is just math.

[Shikkediel]

That was what I was thinking as well but thought I may be overlooking something because although there is no inline width set on the element on the right (which you would expect with JS), it is still the complementary size of the fixed element when it comes to the total screen size. I was kinda waiting for the likes of someone with your CSS caliber to explain it as I do not see the direct clues one would expect for that in the stylesheet.

Edit – hey… padding on body matches the width of the fixed element. That’s a lead.

[Author]

Posts