aligning div's within a div header — OZONE Asylum, home of the Mad Scientists

XML - XSL - XSLT - XHTML - CSS - DOM

aligning div's within a div header

This page's ID: 11106

Edit Post

Who can edit a post?	The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Setting a block level element like a DIV to display inline does absoluty nothing -- well, nothing productive anways. display:block or display:inline only change they way a browser treats an element. The following is a list of elements and thier default display settings: Block: DIV, P, TABLE etc... Inline: SPAN, A, LI, IMG etc... So setting a DIV to display:inline is the same as using a SPAN tag. Dig? Anyways, the solution here it really simple: [code] .headeraddress{float:right;} <div id="header"> <span class="headeraddress"> <b>some text</b><br /> E-mail: <a href="#">company</a><br /> address info<br /> address info </span> <img src="images/logo.gif" alt="logo" width="305" height="71" /> </div> [/code] When working with CSS layouts, always try and use as little markup as possible. Wrapping the logo image in a DIV is qiute pointless. Even if you need to apply block level styles to it you can just give the image an ID arrtibute and set it do display:block (which is a suitable reason to use the display style). Infact, you could possibly do the above with a simple header container like so: [code] #header{float:right;} /* Or text-align:right; */ #header img{position:absolute;left:0px;} <div id="header"> <img src="images/logo.gif" alt="logo" width="305" height="71" /> <b>some text</b><br /> E-mail: <a href="#">company</a><br /> address info<br /> address info </div> [/code] [This message has been edited by Cameron (edited 11-28-2003).] Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu