Andrea
-
Posts
2,596 -
Joined
-
Last visited
-
Days Won
10
Content Type
Profiles
Forums
Events
Downloads
Gallery
Store
Everything posted by Andrea
-
If you have tried it with and without the / in front of images, and you still don't see the image, make sure there are no typos in the file name. Also note that the file name is case sensitive. So in this situation, as I understand, you have this layout: test (folder) .....index.html .....nonome.css .....images (folder) ..........logo82.jpg ..........grass.jpg ..........sports_page.jpg
-
There's nothing attached. What doesn't open? (If you're still not seeing the grass and page images, try putting a / in front of images - I sometimes get confused about when/how I need this slash.) Can you please call your service provider and find out if you have some free space available? As I said before, it'd be so much easier and faster to help you out if I can see what you have going on in all its online-glory.
-
background: url is just how one inserts background images via CSS. You don't actually place the images into your css, just the path to them. Make the following change" * { margin: 0; padding: 0; border: 0; } Delete this: <style type="text/css"> html, body { margin: 0px; padding: 0px; border: 0px; } </style> body { background: url('images/grass.jpg'); -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #container { width: 771px; margin: 0 auto; border-bottom: #adde63 solid 1px; } #header { background: white; } #content { background: url(images/'sports_page.jpg') no-repeat; padding-top: 170px; height: 850px; }
-
In your CSS, you need to delete the part I had commented out <style type="text/css"> html, body { margin: 0px; padding: 0px; border: 0px; } </style> - this does not belong here. That's how you'd write it if you put it inside the head section of your HTML. If your sports_page.jpg and grass.jpg are in the same folder as your css and html, then they should show, but if it's in a different folder, you'll have to adjust the path. In your initial code, you had the CSS in a css folder and the images in an image folder. For helping purposes, it's easier for me to put everything in the same folder, so I changed things. Change things to url('image/grass.jpg') and background: url('images/sports_page.jpg').
-
I can't say what you're missing without seeing what you have. If you suspect it's a path issue, that is easy to figure out - just see where your image is and check if the path matches. If you're having issues taking stuff of my page - note that I have all images and the CSS in the same folder as the html. If yours are in different folders, you'll have to update the path. Try to find a way to upload the page you're working on, helping you would be so much more efficient.
-
You can put the logo into the html. The 'container' that covers the entire page is the body tag. The div container I used (usually, I call it 'wrapper' but the name is irrelevant) limits the content area and centers it. Just create a footer div and place it <p>Fantasy Defense Insurance is a service you.....!</p> </div> <div id="footer> Your Footer Content Here </div> </div> </body> </html> For the space, you can apply the padding to either the p and h tags or the content div (or both). Let me know how it goes.
-
Got the html and css file, and I'm making the following changes: Your doctype is wrong. If you are going to use HTML 4.1, it should look like this: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> However, it's usually better to use a strict doctype - it promotes cleaner coding. But with HTML 5 in the approach, you can now safely save yourself a few keystrokes and just use: <!DOCTYPE html> I'm getting rid of the internal styling, this should all be on your external stylesheet. You're using the h1 and h2 tag and the opening p tag properly. Pre HTML 5, there should be a closing p tag following your paragraph, and you don't have one. I think it'd be ok to skip it, but for simplicity reasons, I'm adding a closing p tag. There should be 2 more sets of opening/closing p tags around your next two paragraphs. (You only had a closing one, but you don't put H tags inside open p tags.) You have an opening header division, but no closing div tag, and there's nothing in it. I"m moving it towards the top and am moving your Fantasy Defense Insurance inside the header div. I'm also adding a new content div around your content. I'll attach the page image to it. I also added the sports-page image as a background. But as previoulsy mentioned, that will give you issues if the content doesn't fit inside this space. Now to the CSS: You can avoid cross-browser issues by setting all default margins and padding to zero and adding them in specifically as needed. I do that with this: * { margin: 0; padding: 0; border: 0; } That also means you can delete the same you have added to your other items. This is wrong: body {body background="images\grass.jpg"} With this background image, you have to consider this: Yours is huge in file-size. if you put it in like you have it, it won't cover every monitor's real estate. If you repeat it, you'll be able to see the 'seems'. If you want to just stretch this one image to cover the entire real estate, add this to your CSS: -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; Instead of floating your container - no need for that - just give it a fixed width and center it (see the container CSS) This is what I got with the above changes. http://wwww.aandbwebdesign.com/KSforum/noname.html If you right-click and chose 'view source' you can see all the HTML and CSS. Let me know if you have any questions.
-
The best way to help you is if you upload the page you are working on. That way, I can see exactly what you have and address any issues directly. I'm not sure about free hosting, those usually include advertisements and other things that clutter up your page, but there is hosting out there for as little as $1/month. Also, often your service provider includes some server space with your internet package. If none of that is an option, email me your css file, your html file, and any images. I'll work with that (but cannot do so until this evening). I'll PM you my email address.
-
Add the grass image to the body tag via css, create a container for your content and add the page image to that container (also via CSS), then putting text on it works by itself.
-
It's hard to help specifically without all the pieces available. However, if you use a big image (the Sports Page picture) you run into trouble when the content is more than fits on there. There are better ways to do this. Overall, understanding stylesheets is essential if you want to learn how to code yourself. For example, a background image really belongs into the CSS not the HTML. Actually, pretty much ALL styling should be in an external stylesheet (a couple exceptions). You may want to follow the numbered steps in the top navigation on this site to give you the basic idea: http://www.how-to-build-websites.com/
-
I'm assuming you are talking about these 2 lines: If that is correct, you'll need this CSS - just add positioning info img { position: relative; } h2 { position: absolute; z-index: 1 } If you have the page uploaded somewhere so I can see your code and if you let me know exactly where you want what, I can help you more specifically. Just be aware that whatever you apply to img will refer to all the images on your site. You may want to add a class or ID to this one and apply the css to it specifially.
-
This might help: http://www.csstutorial.net/2010/06/using-the-css-z-index/
-
Right Here. Killersites is a great place to learn. Scroll to the very top and check the drop-down under "Killersites Network" to the left of the Search Box.
-
Have you looked through the how-to-build pages?
-
Feedback Based on Appearance: Random assortment of fonts. Stick with one type of font for the same type of content. The page is too wide. Your text, on my monitor, does not break until between 'into the' and 'collection'. It's pretty hard to follow such a long line of letters. There's really no design, just some random colors on a light blue/green background. No good navigation through the jokes. My only options are back and next, but I don't know what's next and how much more there will be. And there is no way to get back to home or the contact page while you're cruising through the joke pages. And again, the 100% width makes it really hard to read. Using 'mailto' for the contact is a pretty outdated way. You're exposing your email address to every spambot out there. A better way is to use a contact form. Those require php, but there are plenty of free scripts out there that can be used even if one doesn't know PHP. Feedback Based on the Code: It's much better to use external stylesheets than internal. That way, one style change will affect the entire site. If your styles are internal, you have to change every page individually. The font tag is deprecated. p tags are paragraph tags and belong around paragraphs of text. Using them to create space is incorrect use of the tag. Instead, use padding and or margins. I'm not sure what all the javascripts are for, so I cannot comment on them. There are some letters just above the closing html tag. They probably don't belong there. Suggestions: Create a wrapper around 900 or 1000 px wide, center it, and put your content in there. Create a logical navigation for ALL pages. For a free tutorial that takes you through the basics, try http://www.how-to-build-websites.com/ - It's part of Killersites and a good way to get started. Let us know if you have any questions about anything.
-
Here are the basics: http://www.how-to-build-websites.com/ Follow the navigation steps for a free basic introduction, Killersites has a huge amount of resources to teach you most anything you may want to know (some free, some to purchase). Also, if something doesn't work or make sense, feel free to post your issue here and someone will come and explain. For this, it's always best to have the page uploaded somewhere, so we can see all your actual 'parts'.
-
I don't 'speak' PHP, but I found this via Google: http://stackoverflow.com/questions/14126990/deprecated-function-eregi-is-deprecated-contact-form Hope it helps.
-
It is much easier for us to see what you have going on if you can upload your page somewhere. If that's not possible, we need to see all your code (and still won't have any of your images). What is wrong? What is happening that you don't want to happen, or what is not happening that you are trying to get? Without all this detail, I can give you some general feedback: You use IDs for things that show up only one time on a page. You use a class for something that shows up more often. Technically, you could just use classes, but you cannot just use IDs. Not everything needs to have an ID (or class) attached - that is used if you want to style something more specifically, Simple example: <p> - you can style all your regular paragraph text via CSS directly using the p. But if you have a certain paragraph you want to stand out, you'd attach a class (or ID) to just that one. In your code, you do not need anything to go with your image (assuming there is just one image in your header). You could just style your specific header image: header img {whatever;} chances are, you don't need the positions relative - those sometimes get overused, but I'd need to see how things fall (I'm not good enough to tell that kind of thing by just looking at the code). Another thing - since you are attaching IDs to the elements in your header, you don't even need the word 'header' in your CSS. It's not wrong or will cause an error, but it's redundant, and the less code we use, the better. Please let me know if you have any specific questions about any of the above - or any other questions for that matter.
-
I like the banner part much better now. This is what I was talking about. The 'breadcrumbs' are: Home >> Home 2 It's kind of a directory letting you know where in the page structure you are. It's helpful on complex sites, but probably not needed. You may be able to turn it off whereever it is you customize the theme.
-
I still don't like what I see. I want to insert, so, that 'like' is a very subjective thing, however, let me tell you why I don't like this: Your header section is entirely too large while empty. The space next to the logo is totally wasted, and after that, you're using approximately another third of the monitor real estate as I see it for navigation menu, breadcrumbs (this is a pretty small site - breadcrumbs may be overkill) and then another line with a large amount of space around it for your page title. The actual information - what's in the left column, is a bit hard to read. Increase your line height so the lines don't squash up against each other. What's actually important and should be quite an eye catcher - your bullets - is in too small a font and kind of gets lost and overpowered by the large font to the left and the pictures to the right. If I were looking for a dog park, those bullets would be the number 1 info I'd want. The detail about the park is good, but secondary. In other words, when I'm looking for any kind of service, I first need to know what you can do for me and if you can do for me what I need done. If that's the case, then I want to know who you are. If you don't offer what I want/need, who you are is totally irrelevant. What I would do to streamline the look: Cut the logo up - keep the howling wolf on one side but put the name next to it, spread out ofter the width of your header, thus creating an entire banner with information that only takes up the space it needs. Then put your navigation directly under it, drop the breadcrumbs and drastically reduce the white space around your page title. And talking about page title, 'Training', 'Daycare & Boarding", and such may be worthy page titles, but 'Home' really isn't. This way, your header with navigation would take up approx 2 or os inches of real estate, and the actual message of your page would be right towards the middle of the monitor, where one's eyes are drawn to. As to your comment about columns --- depends on how you use them. Usually on a website, each column contains a different kind of information - as you have on your site right now. That I find easy to read and I get to pick which part I want to focus on first. But if we're talking columns as in a newspaper, where you get to the bottom of one and then have to get to the top of the next to continue reading - for a monitor I find that absolutely clumsy and I thoroughly dislike that kind of reading.
-
The length is generally dictated by content, unless you need a set height for design reasons. As to the width, I usually go with a centered wrapper set at 960. 1024 is a good one to use, too. Generally, it's recommended to go with the most supported width, but now that we also consider iPads and Smart phones, that may have changed a bit. http://www.w3schools.com/browsers/browsers_display.asp
-
DesignerSmith made some excellent points regarding the image size, but I only see the logo having 72 ppi. I don't think there is one right answer to your question about number of pictures - I find a few related pictures throughout break up things and can be quite informative. On a page specifically for pictures, more of them are appropriate. I'd pick them carefully, so. No need to have 12 angles of the same dog, for example. Wordpress is a great tool for websites. It comes with all kinds of fancy features that can be used without actually understanding how they work. Plus, with all the thousands of free themes available, one certainly can find something that works, even without the knowledge of making actual coding changes yourself. As to your site right now - the header is too big. When I open it, all I see is the logo and navigation - my monitor ends right under the search box, so I don't really see anything relevant at first glance. Overall, IMO, there is too much 'white space' on the site. I have to scroll too much to get to the actual information. Also, the bold font on the FAQ page makes reading difficult.
-
Ok - I fiddled around with your code and made some changes. Look at the source and the css - I left many comments as to why I did things. There are some further adjustments needed to look exactly like your page, but that's just fine-tuning. I haven't figured out why your hr doesn't show, but I'm out of time. The main changes I made were to restructure your html, turned your header image into a background image, and got rid of all your positioning and those z-indexes. They were not needed. Let me know if you have any questions: http://wwww.aandbweb...forum/tijn.html Forgot to address your question re the br tags. http://www.how-to-build-websites.com/2011/basic-html-how-not-to-use-the-line-break-br-tag/
-
It's even more fun, when you write your own code.
-
Sorry, don't speak Dutch. I'll look at the page later today or tomorrow, currently only have time for quick replies.