- This topic is empty.
August 19, 2013 at 5:45 pm #147470
Sorry this is in “other discussion”, for some reason it wouldn’t let me post it in “css combat”. Alright so onwards to the question at hand.
So I’m trying to figure out how to make the background color of a box 100% for example but I want the height to be flexible. The content that will be displayed on the color will most likely grow because it will end up being responsive. I need the color to follow the height of the content.
I tried using :before/:after and having it hold the color. The position absolute removes it from its actual location and by that it wont follow the content if i’m correct.
horrible explanation but any ideas?August 19, 2013 at 8:18 pm #147477jurotekParticipant
Can you make something on the CodePen so we can see what you talking about? If you set background color on div, it will always fill the entire height and width of the div regardless of whether the div is dimensioned with absolute or relative values.August 19, 2013 at 9:46 pm #147480
Here is the link. Example
Basically, my body is 80% and I set to margin auto for it to be centered like most sites. Since my about section is within the body, the background color won’t be 100% of the window. It will be confined. The only way I know how to make it be 100% is putting it absolute 100% and sticking it to the left.
Problem is if you resize the size of the browser for responsiveness, the content will stretch vertically but the color won’t. I know I set it to 200px but that’s because it wouldn’t show up otherwise. If I were to set the background color to the “about” or better yet the “content” div, it would definitely follow the size of the content but it would also be confined to the max size of 80% and not 100%.
Know what I mean? @jurotekAugust 20, 2013 at 2:35 am #147501August 20, 2013 at 7:35 pm #147645
@Paulie_D Hey man, thanks. I had thought about something similar to this but this works. I just have to add the width and margin to every main element to center it rather than setting it to the whole body.
Helpful :)August 21, 2013 at 12:14 am #147656NishantParticipantAugust 21, 2013 at 3:29 am #147669
- The forum ‘CSS’ is closed to new topics and replies.