473,385 Members | 1,908 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,385 software developers and data experts.

Vertical align two divs, w/o using tables?

Hi,

I've have two divs, that are laid out side-by-side. (I'm floating the first
div to the left) I need to set up css on these two divs so that the second
div is vertically aligned to the first one (in the middle). How can I go
about doing this?, both divs contain textual elements and I won't easily
know the heights, so absolute positioning is out. I've also tried using the
vertical-align selector to no avail. I'm trying to find a way
without using an html table, because I know I can get it to work great with
those, but I'm trying to block that mentality right now, but if it is the
best way, please tell me!

Thanks,
--Michael

Jul 20 '05 #1
12 12349
"Michael Ramey" <ra*****@spam.org> wrote:
I've have two divs, that are laid out side-by-side. (I'm floating the first
div to the left) I need to set up css on these two divs so that the second
div is vertically aligned to the first one (in the middle). How can I go
about doing this?


Works fine here, url?

--
Spartanicus
Jul 20 '05 #2
"Michael Ramey" <ra*****@spam.org> wrote:
I've have two divs, that are laid out side-by-side. (I'm floating the first
div to the left) I need to set up css on these two divs so that the second
div is vertically aligned to the first one (in the middle). How can I go
about doing this?


Works fine here, url?

--
Spartanicus
Jul 20 '05 #3
Yeah, that probably would help, I failed to mention I have divs inside these
two divs.

http://www.ncfunds.com/tnc.html

You'll see what I mean when you look at this, vertically align the text part
on the right with the logo part on the left. (So the text won't appear off
balance from the logo).

Thanks,
--Michael

"Spartanicus" <me@privacy.net> wrote in message
news:e8********************************@news.spart anicus.utvinternet.ie...
"Michael Ramey" <ra*****@spam.org> wrote:
I've have two divs, that are laid out side-by-side. (I'm floating the firstdiv to the left) I need to set up css on these two divs so that the seconddiv is vertically aligned to the first one (in the middle). How can I go
about doing this?


Works fine here, url?

--
Spartanicus

Jul 20 '05 #4
Yeah, that probably would help, I failed to mention I have divs inside these
two divs.

http://www.ncfunds.com/tnc.html

You'll see what I mean when you look at this, vertically align the text part
on the right with the logo part on the left. (So the text won't appear off
balance from the logo).

Thanks,
--Michael

"Spartanicus" <me@privacy.net> wrote in message
news:e8********************************@news.spart anicus.utvinternet.ie...
"Michael Ramey" <ra*****@spam.org> wrote:
I've have two divs, that are laid out side-by-side. (I'm floating the firstdiv to the left) I need to set up css on these two divs so that the seconddiv is vertically aligned to the first one (in the middle). How can I go
about doing this?


Works fine here, url?

--
Spartanicus

Jul 20 '05 #5
"Michael Ramey" <ra*****@spam.org> wrote:

Please don't top post, corrected this once. Kindly also configure your
news reader so that it doesn't mangle quotes.
>I've have two divs, that are laid out side-by-side. (I'm floating thefirst >div to the left) I need to set up css on these two divs so that thesecond >div is vertically aligned to the first one (in the middle). How can I go
>about doing this?
Works fine here, url?

Yeah, that probably would help, I failed to mention I have divs inside these
two divs.

http://www.ncfunds.com/tnc.html
Why are you suing such a convoluted way to construct a logo, what's
wrong with using an image? Have you checked in any other browser than
IE? (try viewing it in Opera or Mozilla)
You'll see what I mean when you look at this
I don't, the "logo" and the text are displayed next to each other.
vertically align the text part
on the right with the logo part on the left. (So the text won't appear off
balance from the logo).


Are we supposed to know what you consider "off balance"?

--
Spartanicus
Jul 20 '05 #6
"Michael Ramey" <ra*****@spam.org> wrote:

Please don't top post, corrected this once. Kindly also configure your
news reader so that it doesn't mangle quotes.
>I've have two divs, that are laid out side-by-side. (I'm floating thefirst >div to the left) I need to set up css on these two divs so that thesecond >div is vertically aligned to the first one (in the middle). How can I go
>about doing this?
Works fine here, url?

Yeah, that probably would help, I failed to mention I have divs inside these
two divs.

http://www.ncfunds.com/tnc.html
Why are you suing such a convoluted way to construct a logo, what's
wrong with using an image? Have you checked in any other browser than
IE? (try viewing it in Opera or Mozilla)
You'll see what I mean when you look at this
I don't, the "logo" and the text are displayed next to each other.
vertically align the text part
on the right with the logo part on the left. (So the text won't appear off
balance from the logo).


Are we supposed to know what you consider "off balance"?

--
Spartanicus
Jul 20 '05 #7
The first thing I thought when I heard the assignment was to use a picture,
but the boss man wants our logo presented like this, so that's what he's
going to get. It's for a signature in an email, and we don't want a hit to
our webserver every time someone reads their email.

The text in the right div that has the contact information is stuck at the
top, I want it in the center, vertically aligned to the logo. Moved down,
say 10 pixels (but I don't want to directly specify how far to move it down,
I just want to specify that it is to be vertically centered to the div
floated to the left of it)

so instead of this

blah blah
blah
blah

it would be..

blah
blah blah
blah
Jul 20 '05 #8
The first thing I thought when I heard the assignment was to use a picture,
but the boss man wants our logo presented like this, so that's what he's
going to get. It's for a signature in an email, and we don't want a hit to
our webserver every time someone reads their email.

The text in the right div that has the contact information is stuck at the
top, I want it in the center, vertically aligned to the logo. Moved down,
say 10 pixels (but I don't want to directly specify how far to move it down,
I just want to specify that it is to be vertically centered to the div
floated to the left of it)

so instead of this

blah blah
blah
blah

it would be..

blah
blah blah
blah
Jul 20 '05 #9
"Raterus" <ra*****@localhost.com> wrote:
The first thing I thought when I heard the assignment was to use a picture,
Who are you? Related to the OP?

If you follow up, please quote a relevant snippet of what you are
replying to above your follow up.
but the boss man wants our logo presented like this, so that's what he's
going to get.
You've lost me, why would using an image restrict your options on how it
should look?
It's for a signature in an email, and we don't want a hit to
our webserver every time someone reads their email.


So? Send the image with the email.

--
Spartanicus
Jul 20 '05 #10
"Raterus" <ra*****@localhost.com> wrote:
The first thing I thought when I heard the assignment was to use a picture,
Who are you? Related to the OP?

If you follow up, please quote a relevant snippet of what you are
replying to above your follow up.
but the boss man wants our logo presented like this, so that's what he's
going to get.
You've lost me, why would using an image restrict your options on how it
should look?
It's for a signature in an email, and we don't want a hit to
our webserver every time someone reads their email.


So? Send the image with the email.

--
Spartanicus
Jul 20 '05 #11
Thanks anyway, I'll look elsewhere if all you can provide is criticism.
Jul 20 '05 #12
Thanks anyway, I'll look elsewhere if all you can provide is criticism.
Jul 20 '05 #13

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: Michael Ramey | last post by:
Hi, I've have two divs, that are laid out side-by-side. (I'm floating the first div to the left) I need to set up css on these two divs so that the second div is vertically aligned to the...
2
by: Eric Lindsay | last post by:
If I want to have the middle of an image vertically aligned with the middle of a heading (or several lines of heading), is there some particular way people would recommend? vertical-align: center...
15
by: scott | last post by:
Hello, I'm working on updating some of my table-based sites to use CSS instead of tables. One of my sites has a header that is composed of three elements: A B C In my prior design, this was...
18
by: ~john | last post by:
Sorry if this is a dumb question buy my CSS is pretty bad... but how do I get text to center vertically within a div tag? Here's my code below... the text is displaying on the far top-right. I...
5
by: Markus Ernst | last post by:
Hello This is a test example: http://www.markusernst.ch/anthracite/ http://www.markusernst.ch/anthracite/living_divani.html After googling and experimenting for several hours, I ended up...
4
by: O11Y | last post by:
Hello, I've read numerous posts & guides on this subject but i'm still having problems. I'm writing some HTML for the company intranet and all our browsers are currently (you guessed it) IE6. ...
2
by: esteuart | last post by:
I need to get the right combination for a div to clip any text inside and allow vertical alignment. I only have this problem in FireFox. I have 3 divs nested within each other. The outer div has...
8
by: Dave Rado | last post by:
Hi See my mock-up at http://tinyurl.com/35tv29. The three icons are supposed to be vertically aligned on their bottoms (using "vertical- align: bottom"), but they aren't, they're vertically...
40
by: maya | last post by:
hi, how do I get text to vertical-align inside a div? http://www.mayacove.com/misc/home.html vertical-align should work, according to this:...
2
Ciary
by: Ciary | last post by:
hi fellow coders, i'm not sure if this is the right place to ask since it's rather specific. i've got some questions using EXT JS. i've been asking on there forum but i didn't get a reply...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.