Html, table, img & css - how to get text to wrap correctly?


Tags: html,css,table

Problem :

I've got the following code; however it's not given me the desired result - what I am after is as per the image below, what am I doing wrong?

<style>
table.control_grid tr {
    text-align: center;
    width: 200px;
}
table.control_grid td {
    width: 120px;
    height: 48px;
}
table.control_grid a {
    text-decoration: none;
}
table.control_grid img {
    vertical-align: text-top;
}
</style>

<table class="control_grid">
    <tr>
        <td><img width="48" height="48" src="icon1.gif">My text & stuff, overflow??</td>
        <td><img width="48" height="48" src="icon1.gif">Icon1</td>
        <td><img width="48" height="48" src="icon1.gif">Icon2</td>
        <td></td>
        <td></td>
    </tr>
</table>

Desired result:

Desired result



Solution :

You should float the images.

float:left;


    CSS Howto..

    How to automatically scroll when div expands at bottom of page?

    How do I use CSS to reposition this image?

    How to align/move Vaadin buttons

    How do you maintain CSS layout when adding content (ASP.NET)

    how to make zurb foundation framework off canvas look flat

    How to target individually nested elements using CSS

    How to make a snowboard (or squeezed rectangle) shaped div in css?

    How do you target div last-child within another div?

    How to resize grid-view column width?

    How to position
    element absolute from browser window?

    How to make a HTML NavBar [closed]

    How to use scaleable pixels in css

    How to create folder style in CSS

    Change image src for product “showoff”

    How do I scroll d3 elements while keeping a portion of the svg in a fixed position?

    How can I dock the button to jQueryUI dialog bottom as the dialog inner content increases?

    How to grey out a box in CSS

    Disable the centring image function in a slideshow plugin?

    How to center the center circle?

    How to integrate many CSS files

    How to use CSS attribute selector for an SVG element with namespaced attribute href?

    How to make a span tag wider with an alphabet inside?

    How to contain text box in parent div

    Hide/Show table in my Email with the use of a button

    How to make comment shape using css

    How To Layout a Grid in CSS

    How to Centralize a Float on the Screen (such horizontally as vertically) Using CSS

    How do I center elements on a page using percentage widths?

    How to get block to change width if text is longer then the width in a multilevel listless drop down navigation menu

    how to get a div to randomly move around a page (using jQuery or CSS)