|
Posted by Ben C on 01/30/07 19:48
On 2007-01-30, Remy <rblaettler@hotmail.com> wrote:
> I have Header Panel with a starting image and then a background image
> and some text.
> I would like to have everything on one line inside the 28px block. The
> background should start AFTER the image.
Put the img inside the <div class="panelHeaderContent">.
Starting a new non-floated normal-flow block box (like a div) always
starts a new line.
A few odd things in your markup, comments below:
><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
> www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Better to use HTML 4.01 strict doctype, search archives for
explanations.
><html xmlns="http://www.w3.org/1999/xhtml" >
><head>
> <title>Untitled</title>
> <style type="text/css">
>
> .panelHeader
> {
> height:28px;
> width:100%;
width:100% is unnecessary-- normal flow block boxes fill the containing
width anyway. width:100% will cause problems if you give panelHeader
borders, padding or margin.
> display: block;
> }
>
> .panelHeaderBgStartImg
> {
> position: relative;
Why relative?
> display: inline;
> float: left;
display:inline meaningless since float:left as Jonathan N. Little
already commented.
Sometimes display:inline is used in conjunction with float to get rid of
list-item bullets in browsers that don't support list-style-type:none.
But this isn't a list item.
> .panelHeaderContent
> {
> position: relative;
> display: inline;
> height:100%;
> float: left;
No need for display:inline or position:relative here.
[Back to original message]
|