Multiple columns, column-span workaround

I'm working with Safari and I need to have multiple columns text (in a single <p> through webkit-column-count开发者_JAVA技巧), but also I need to make an image span upon two or more columns (I know it's not supported yet, but I'm asking for some workaround if possible)

meaning: I want this layout

---------------------------

image

---------------------------

------------  -------------

first column  second column

first column  second column

first column  second column

------------  -------------

the first column and second column are in a single <p>

PS: this question has been asked before in Column layout in HTML(5)/CSS

I agree with the previous poster, and I am confused as to why you would want to place your image in a paragraph tag. If I were you, I would create the columns in divs or in a table, and keep that separate from the image. Place the image in an img tag, which you can then specify width, etc with CSS.

For example, your HTML might look like this:

<header>
    <img src="url(insertyourfilepath.gif)" />
</header>
<div id="columnWrapper">
    <div id="column1></div>
    <div id="column2"></div>
</div>

Then your CSS could look like this:

img{
    width:400px; //insert your image dimensions here
    height:200px;
}
#column1, #column2{
    width:200px; //the width of both columns can be controlled with one CSS entry, or
                 //for 2 different widths, separate them and assign different dimensions.
}

If this does not answer your question, I respectfully submit that you post your code here and try to explain in more detail the choice that you made regarding placing your image inside the paragraph tag.

I hope this helps!