Reputation: 2656
I have a menu system that contains both text, and images. My images are slightly larger ( in height ) than the text is and would like to add a little more margin space to the elements that don't contain an image inside it. How would I go about doing that? My HTML looks like this:
<div id = "menu2">
<div>
<a href = "index.php">
<img src = "images/home.png" alt = "Home" title = "Home"/>
</a>
<a href = "#">
Menu_Item_1
</a>
<a href = "#">
Menu_Item_2
</a>
</div>
</div>
In my case, I would like to style (using css/css3) the elements that don't have an image child.
Upvotes: 0
Views: 37
Reputation: 5
<div id = "menu2">
<div>
<a href = "index.php">
<img src = "images/home.png" alt = "Home" title = "Home"/>
</a>
<a href = "#" class="ses">
Menu_Item_1
</a>
<a href = "#" class="ses">
Menu_Item_2
</a>
</div>
</div>
<style>
#menu2 a .ses{
color:#f2f2f2;// whatever you want..
}
</style>
Upvotes: 0
Reputation: 2954
You can apply line-height
to your links:
line-height: 50px;
Where 50px
depends on your images height.
Upvotes: 1