2010-11-12 4 views
1

J'ai une image, qui est float: left;Déterminer, si l'élément est enroulé autour du flottant élément

une étiquette ul est enroulée autour de cette image. C'est sur le côté droit de l'image.

Les puces personnalisées contenues dans ul chevauchent partiellement l'image flottante.

Lorsque le ul est légèrement déplacé vers la droite, cela est corrigé. Mais, pour ce faire, j'ai besoin de déterminer si le ul est enroulé autour de cette image.

Comment le faire?


Mise à jour 1:

Ce code illustre le problème. C'est vrai aussi pour les balles standard, pas seulement sur mesure.

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>Bullets overlapping example</title> 
</head> 
<style type="text/css" media="screen"> 
body { 
    display: block; 
    width: 400pt; 
    margin: auto; 
    border: solid thin gray; 
} 
img { 
    float: left; 
    width: 250pt; 
} 
</style> 
<body> 
<img src="http://www.hermann-uwe.de/files/images/blue_flower.preview_0.jpg" /> 
<p>Bullets in a list below must be fixed someway, to prevent overlapping of float image</p> 
<ul> 
    <li>Bullet of this list item overlaps left-hand-side image.</li> 
    <li>This list item too</li> 
    <li>And this ...</li> 
</ul> 
<div style="height: 6em;"></div> 
<p>This list should not be fixed, because it <b>does't wraps</b> the image</p> 
<ul> 
    <li>One</li> 
    <li>Two</li> 
    <li>Three</li> 
</ul> 
</body> 
</html> 

Répondre

1

Vous pouvez contrôler le comportement spécifique des images à l'intérieur à l'aide ULs sélecteurs CSS:

ul img { ........ } /* This rule will apply only to images inside ULs */ 

Il est possible en JavaScript, aussi, mais cela devrait être possible de trier en utilisant CSS pur.

+0

Non, ce n'est pas mon cas. J'ai la propriété "list-style-image" en CSS. Il ne peut pas être contrôlé de cette façon – AntonAL

+0

@Anton ahh Je vois, vous devez adresser le 'ul' s'il contient une image? –

+0

Non, j'ai besoin de "Déterminer, si l'élément a été enroulé autour de float-element" (voir le titre du post :). En d'autres termes, j'ai besoin d'appliquer certains styles CSS uniquement aux éléments, cette disposition a été modifiée par des éléments flottants. – AntonAL

Questions connexes