I have the following code:
CSS part:
<style type="text/css"> .menu { width:200px; } .menu ul { list-style-image:none; list-style-type:none; } .menu li { margin:2px; } .menu A { height:25px; width:170px; background:url(./images/button-51.png); padding:2px 5px ; } .menu A:link { height:25px; width:170px; background:url(./images/button-51.png); padding:2px 5px ; } </style>
HTML part:
Everything work fine, but when I add 'DOCTYPE' element in the beginning of the HTML document:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
the width of 'a' element is not taken into account.
Question 1: Why?
Question 2: How to fix that?
Thanks a lot!
To convert it to a fixed-width layout, simply add a fixed with to the #wrapper and set the margins to auto. Setting the margins to auto will cause the left and right margins to be equal no matter how wide the browser window is, which will cause your fixed-width layout to be positioned in the center of the browser.
While the display property is inline , height and width will not work. display :inline; By changing the display property from inline to block or inline-block , height and width should be worked properly.
Yes, as per the CSS 2.1 Specification, all non-negative values are valid for width, that includes percentage values above 100%.
The width CSS property sets an element's width. By default, it sets the width of the content area, but if box-sizing is set to border-box , it sets the width of the border area.
Question 1: Why?
Because it's by default not a block element.
Question 2: How to fix that?
Make it a block element using display: block;
, or an inline block by display: inline-block;
.
make block for anchor tag add display:block
in style
.menu a { display:block; height:25px; width:170px; background:url(./images/button-51.png); padding:2px 5px ; }
NOTE: dont repet all elements in .menu a:link
class.. just add changes or new styles. NOTE: always use lowercase in html and css code
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With