I’m having a bit of a frustrating issue…I thought I found a few answers here but nothing as of yet seems to be working.
Here is an image to start off with:
http://www.shaunmbaer.com/wordpress/wp-content/uploads/2013/02/Melissliss_01.jpg
Then here is the html:
<section class="A">
<aside class="B"></div>
<header class="C">Title</header>
<article class="D">Lorem ipsum...</article>
</section>
And the css as of now:
A{width:100%}
B{width:220px; height:100%; float: right; background= #fff url("foo") repeat}
C{width:450px}
D{width:450px}
I am using wordpress (this bit is a post), so all of the content is automatically generated. I need div “B” to be 100% of the parent div. It does not have any content besides a repeating background image (the site is responsive and this div will disappear at the next breakpoint).
I cannot position them absolute since I cannot give the article (“D”) a fixed height (at least I think that statement is correct…)
Can anyone help or point me to somewhere that can? Preferably a CSS solution, but jQuery is a-ok at this point too!
Thanks a ton2.
I’m pretty sure you can use absolute positioning for the B element, and specify 3 sides for the element to stick to: