Forum Moderators: not2easy
I'm a newbie, so please be gentle.
I'm constructing a website [snip], which I would like to be compliant with HTML 4.01 Strict. At the moment I've setup most of image properties in css. For example
#Logo {
position:absolute;
width:228px;
height:148px;
z-index:1;
top: 0px;
}
There is one property, the border property, which I can only get to work by inputing it to the <div> tag. This means the document doesn't comply to strict docutype. So at the moment I have code as follows.
<div id="Logo"><a href="index.html"><img src="images/Logo.png" alt="Limousine Logo" width="228" height="148" border="0" ></a></div>
If I remove the border="0" from the <div> tag my graphics is repositioned slightly (it is indented by 1 pixel from the top and left margins of the page). I would appreciate any assistance.
[edited by: SuzyUK at 7:10 am (utc) on Jan. 22, 2007]
[edit reason] Please no site specifics for review [/edit]
Please remember you're not allowed to drop URIs like that - please see the Webmaster World Terms of Service [webmasterworld.com] and the CSS Forum Charter [webmasterworld.com].
About your problem, I'm not entirely sure what you're asking, but do you want to remove the border from the
#Logo? If so, all you have to do is add this:
#Logo { ...
border: 0;
... } Add the border property to your
#Logo selector and it will be removed. However, you don't actually have
border="0" on your div element, so I'm guessing what you want is to remove the border from the <img /> within the div: #Logo img { border: 0; } It's as simple as that :)
Let us know if this isn't what you're after.
Thanks for the quick response Setek.
I have attempted to use
#Logo { ...
border: 0;
... }
I then go to my <div> tag and remove the reference to border="0"
The end result is my graphic is repositioned, so it's not where it should be. Instead of the graphic sitting flush with the top left-hand boarder of the page. The graphic moves down and to the right a pixel or two. I can created a demo/test page so you can see the difference if this is convenient?
I can created a demo/test page so you can see the difference if this is convenient?
No no, it's fine :) If we can show the test code that's having a problem, future people with the same problem can read through this post and get the answers they need too.
I have attempted to use#Logo { ...
border: 0;
... }I then go to my <div> tag and remove the reference to border="0"
In the code you've posted, there is no proprietary
border="0" on your <div> element itself, rather, on the <img /> element. <div id="Logo"><a href="index.html"><img src="images/Logo.png" alt="Limousine Logo" width="228" height="148" border="0" ></a></div>
(my big :D)
If you mean removing the proprietary
border="0" on the <img />, you'll have to use the other bit of code I posted: #Logo img { border: 0; } Which will do what the proprietary attribute is trying to do - remove the border on the image.