Hi Guys,
This is going to be another one of my lots of questions threads!
I want to build my photoblog in CSS, to look like this:
http://www.sixthsense-esp.co.uk/Robisms/HTML-Layout.htm
Unfortunately i've already stumbled into problems with the CSS version:
http://www.sixthsense-esp.co.uk/Robisms/Layout.htm
First off, how comes the top image border is not showing?
Also, the fact that the top line is an H1 tag seems to affect where the DIV starts in different browsers (different in Firefox, IE and Safari), is there any way round this?
Finally (for now!) i have used line height attribute to change the menu list, but again in different browsers shows different line heights! Is there a way of removing the default line height so i don't get the massive space between menu items?
Here's a link to the CSS BTW.
http://www.sixthsense-esp.co.uk/Robisms/styles/Layout.css
Many thanks!
Rob
demonhale posted this at 15:52—20th November 2007.
He has: 3,258 posts
Joined: May 2005
The image borders are not showing because of the css style commands that point to the classes and Id' used.
You should change the div property of photos on the css to something like this:
#photos{
margin-left: 50px;
margin-top: 25px;
margin-bottom: 22px;
width: 400px;
}
Then remove the "mg" in front of the photos class like so
.photos {
border-style:solid;
border-color: #202020;
border-top-width:6px;
border-bottom-width:0px;
border-left-width:0px;
border-right-width:0px;
}
Then edit the div.photos class to 11 px to match the original like so
DIV.photo {
margin-bottom: 11px;
}
Now you have no problems in the Images Area, just recheck the errors on your CSS to fix everything else, and yes theres a css line-height property you can use for line spacings....
Visit my New Blog Gee, Please... | Designer Graphics 9
demonhale posted this at 05:37—22nd November 2007.
He has: 3,258 posts
Joined: May 2005
I just noticed that the mg.photos should be img.photos... there are some editing errors on your css...
Visit my New Blog Gee, Please... | Designer Graphics 9