Solved

make background-color fill the div block

Posted on 2011-03-21
5
710 Views
Last Modified: 2012-08-13
http://asqastage.esa.edu.au/subscribe-for-updates.html

how do you make the dark grey background colour (#E5E4E4) in 'subscribe me to:' and 'i am a:' go down to the same level as it's corresponding input field?

The other fields dont have the same problem because chracters in their respective divs fit in one line.


0
Comment
Question by:jeremyll
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
5 Comments
 
LVL 40

Expert Comment

by:gurvinder372
ID: 35179642
label's background-color is
rgb(229, 228, 228);

and the input field's is
rgb(241, 241, 241);

In style.css, you need to change
.formContainer .column1Item {
      background-color:#e5e4e4;color:#444444;padding:10px;font-weight:bold;margin:0;float:left;width:188px; font-size:0.875em;
}

with

.formContainer .column1Item {
      background-color:rgb(241, 241, 241);
      color:#444444;padding:10px;font-weight:bold;margin:0;float:left;width:188px; font-size:0.875em;
}
0
 

Author Comment

by:jeremyll
ID: 35179811
Thanks gurvinder372

I don't think I've explained my question clearly.

The label's background-color is meant to be rgb(229, 228, 228);

I'm not worried about the color. The labels with the dark grey background color is meant to fill up so that there are no white areas which 'subscribe me to:' and 'i am a:' has. There's just a 1px gap between the label div and the input div.

0
 
LVL 16

Assisted Solution

by:HagayMandel
HagayMandel earned 150 total points
ID: 35179942
It's a matter of div's height, that you cant control without javascript.:
You need a script that checks each "input" div's height and assigns the same height to the "label" div.
My 50 cents, put it all in a 2 columns table and forget all about it, or add the following rule to the CSS
.formContainer
{
   background-color: #E5E4E4;
}

Open in new window

0
 
LVL 11

Accepted Solution

by:
mattibutt earned 350 total points
ID: 35180070
hello mate,

try adding: style="height:159px;"

just like this...

<div class="column1Item" style="height:159px;">I am a: </div>


and: style="height:60px;"

just like this...

<div class="column1Item" style="height:60px;">Subscribe me to: </div>

the reason why i have done in-line CSS styling is because your classes have the same name, you can do this in your external CSS too if you like, you just have to add a new and different named ID to each field and call them in your code, it is the same thing anyway just 2 different ways of doing it...


Cheers

0
 

Author Comment

by:jeremyll
ID: 35180145
wow, thanks guys. I'm conviced that I just have to put a fixed height. was hoping to use an 'auto' value somewhere to 'auto fill'. there goes that idea.

Thanks!
0

Featured Post

Turn Insights into Action

Communication across every corner of your business is essential to increase the velocity of your application delivery and support pipeline. Automate, standardize, and contextualize your communication processes with xMatters.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
Does your audience prefer people in photos or no people? How can you best highlight what you’re selling? What are your competitors doing, and what can you do that is different and unique from them?  Continue reading to learn how to make your images …
This video teaches users how to migrate an existing Wordpress website to a new domain.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

717 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question