Great, Thanks for fixing that on the first post. I just learned today that a link to an image will let the image show in my message. Now that I now that I plan to maintain the folder with the images on the web server at least for awhile so others may be able to take advantage of the solutions I am receiving. Unless something comes up I need to change the locations I will just maintain that directory.
1 Like
I just noticed the first link did not have a border, I left that in place and created a copy of the page and css renamed both and added a border. So the original non border is at the first link and the new with a border is here. Easy to compare that way. Just shrink the page and you will see the margins are different between the two versions.
http://www.quailrunrv.com/html5layout/border_templateqr2015.html
Wow I only though you could apply to Sections Divs and other block items etc. Did not know you could just add the word video and be done with it. So I guess that means I could add image or other if I wanted something special with them too.
See if this behaves the way you want?
.redbox {
color: #ffffff;
background-color: #982a3a;
max-width: 200px;
padding: 1px 6px;
margin: 0 2px 5px;
}
.bluebox {
color: #ffffff;
background-color: #5c759f;
max-width: 200px;
padding: 1px 6px;
margin: 0 2px 5px;
}
.center_box {
color: #ffffff;
background-color: #5c759f;
max-width: 200px;
padding: 1px 6px;
margin: 0 auto 5px;
}
I though we had that one figured out. Did you see something I missed with those other than the fact the margins were a little off from the rest of the items. If so I can fix it. That may be what you already gave me here.
The one I am trying to figure out now are the floated images. The ones that look like black boxes. I have two working samples one with and one without a border.
Yes, the margins were a tad different and this fixes the difference.
Someone else will have to work with you about the floating images. Itās past my bedtime and my cats are circling.
Not a problem, I appreciate everything you have done tonight. As for the floating images the boarders are kind of just a wish not a necessity so if they are not completed I can address them any time in the future. I have plenty of work ahead of me to now start building out the content.
Have a great evening and donāt make the cats mad, You never know what they may do in the middle of the night. As a matter of fact I have a very funny thing I saved from the net years ago back in the 90ās it is about cats. I think you will love it. Will send it in a private message.
Alright now, I just about have it. I have a new menu in place, I have my new gallery in place. The only thing left now is one final alignment which is off by 2 pixels.
If you look at the page through the link posted earlier and make your browser as narrow as possible, you will see that the spacing between the color boxes and the sides of the container are 2 pixels more on each side than the large image, mobile tables, floated images and the video.
What I need to do is reduce that gap to match the rest. I have played with the margins and padding but not exactly sure what I can adjust to make it just right.
I am going to remove the short cuts which I have where all 4 measurements are not listed in the css and give all 4 for now until I get use to the order they fall in.
Thanks
I finally got this thing figured out. I was stuck on the fact that the issue revolved around one setting margin or padding.
Well it turned out that it was a combination of both. I finally figured it out by just removing all margins and padding and starting with the fresh elements.
I knew this was going to be a chore as being old school html4 and not up on css and html5. Anyway I now have my template in place with just one issue for another thread but it is not a big deal and probably nothing can be done. It is about zooming.
Anyway I came back to thank @ralphm, @ronpat, @RyanReese and @TechnoBear (in alphabetical order) no favoritism here for their help getting this completed.
One day I just hope I learn enough with my limited time that I can simply look at the code like you guys do and say, hay I know what is wrong here. Will just keep my 
out for any chance I get to learn more.
Heh, well to be honest, most of anything useful about HTML and CSS that I can offer I learned by hanging around here. 
I guess it is a good place to learn then.
I would like to keep the images here on the post for at least a while in case it helps others. I would like however to move them to a central location for all sitepoint forum screen shots so I can keep them organized.
I can not edit my old posts is there a way if I move the images that someone else can simply change the path?
Thanks
The images here get processed by the system, I believe, so you canāt really set a pathāunless perhaps they are hosted externally, which isnāt ideal, as those kinds of links tend to die over time, leaving broken posts.
They are external, any way to move them in since I canāt post images yet? Same for the zoom one I just posted.
You should be able to. The restriction only last for your first few visits/posts. You can either use the upload button or just drag images in place (if using modern browsers).
Okay then, I will try that next time. But I can not edit the images in this post as it is too old for me to access. The images are still where they should be for now at least.
Hm, the ones in post 7 seem to have broken already. 
Fixed,
When I made my new directory where I was going to hold on to current screen shots I accidentally renamed the directory holding these. 
1 Like
Iāve edited post #7 and replaced the linked images with uploaded copies.
Great thank you. Now that I know you can drag images into the window that is how I will do it from now on.
2 Likes
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.