aligning with CSS

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

No clue.
- I want to align the red, green, blue boxes in one line
- red,green,blue must be 45px high
- red (center) must be as wide as possible
- yellow must start exactly below the line
- yellow must be left aligned with red one.

Please, please help!

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//DE">

  background-color: green;
  margin-left: 32px;
  width:  12px;
  height: 45px;

  background-color: red;
  width:  90%;
  height: 45px;

  background-color: blue;
  width:  12px;
  height: 45px;
  background-color: yellow;
  margin-top: 45px;
  margin-left: 44px;


 <div class="X1">&nbsp;</div>
 <div class="X2">Header</div>
 <div class="X3">&nbsp;</div>
 <div class="Y2">Her is some long text</div>


Re: aligning with CSS

With neither quill nor qualm, Gernot Frisch quothed:

Quoted text here. Click to load it

Use a div, background:red; float inner sized red div left, blue right.

Another div below, yellow background, body-background inner divs similar
to above.

In some browsers divs may not show unless they have content.

Contrary to popular belief, it is believable.

Re: aligning with CSS

Quoted text here. Click to load it

I'm totally new to css/html and I don't understand everything you
said. Can you give an example?

Re: aligning with CSS

Quoted text here. Click to load it

i hate to come in sounding snarky, but have you considered buying a book or
doing some online tutorials?  The best way to learn is by figuring things
out.  Nobody is going to do your work for you.

Re: aligning with CSS

Quoted text here. Click to load it

Well, I dunno, you could say something like this to be nicer:

Quoted text here. Click to load it

You can't do it this way. Ask yourself what the 90% width of the
X2 class could be a percentage of?

Look at a series of blocks and css to get as close to what you
want as possible: here is a little rough unfinished start, ask
about how to improve it or revise it so it actually does what you
want as long as it is a sensible thing to want... I give a simple
fixed width container example, that looks closest to what you
want. Fluid layouts are trickier but much more worthwhile in the
end. Have a go with different widths, auto or percentages.

Post the results of your efforts in a URL and try not to use a
miserable lowdown cheapskate free host like me...

Mr. Flavell is going to help you, but he needs to see you try
harder. He is like that. Stern and Scottish, you see... :)


Site Timeline