Styling the HTML-List
Last updated on
30 April 2025
We want to format the list of thumbnails to float horizontally and not vertically, no leading discs and more. With css we can achieve this:
.book-navigation
{
clear: both; /* new line for menu */
}
/* view gallery */
.view-gallery .item-list ul li
{
display: inline; /* enable floating */
list-style-type: none; /* no leading disc */
line-height: 50px; /* to have enough space between rows */
padding: 0;
}
.view-gallery .views-field-field-image-fid
{
background:transparent url(film.png) repeat-x scroll 0 0;
float: left;
margin: 0;
padding: 16px 6px 16px;
}
.view-gallery .imagecache-small_quadrat img
{
border: 4px solid black;
}
.view-gallery a.imagecache-small_quadrat.active img
{
border: 4px solid red;
}
Perhaps you have to adjust the class names. They correspond to the system names of the node types and views we use.
You can find a sample theme with this css in #329868: node translation vs attribute translation. Unpack it in sites/all/themes and activate it.
Help improve this page
Page status: Not set
You can:
You can:
- Log in, click Edit, and edit this page
- Log in, click Discuss, update the Page status value, and suggest an improvement
- Log in and create a Documentation issue with your suggestion