Does it help if you fix the errors?
* hint - style, width and height are separate attributes.
* bonus hint - get in the habit of validating your HTML https://validator.w3.org
It would be helpful to us if you changed the local path to your CSS file to a full URL so we can see it, too… or just post the CSS in another code box. Looks like you could also attach the images so we could add those same images to our test version of your code.
Think of it as a “working page” that includes all of the parts that we need to reconstruct the issue on our computers without requiring a crystal ball
You can also upload to your hosting, to a test folder.
“www.yourdomain.com/test” upload your files here so they are not live and post the test link here so that we can see it live and in action instead of pieces of code.
I’m guessing the dot is an underline, the default styling for <a> links. With the closing </a> tag being on a new line, that creates a space which is being underlined.
Try something like:- header a { text-decoration: none }
This:-
And get out of the habit of using the style attribute. Keep styling in the css.
Tried putting it in the .css file & tried at the < style > area but nope, didn’t help :I
And yes, I know, but it’s kinda hard I guess, I can’t make each button / image at the exact place I want it to be…
I have to use each different padding for the images / buttons anything.
Hello,
I would like to know how to make it adjust to any device, using position : fixed ; is fixing a bit but when I try to zoom in it just goes everywhere, is that ok or?
While exceptions exist, the human equation is usually pretty simple:
A lack of sensible effort (including conversation) on your part usually equals diminished interest on our part,
I notice that you have not acted on Mittineague’s post #4. He gave you some changes that only required individually copying and pasting them, and he recommended that you run your test code through the HTML validator.
Mittineague’s recommendations will not directly address your new requirement for responsive behavior, but for all I know the gray dot is still a problem that has not been fixed. There has been no follow-up from you.
Your requirement to put the shapes in the top menu into a responsive layout is actually quite challenging. Adding responsiveness to the mix will require you to talk about how you expect the page to behave at different widths because that menu will not simply “shrink to fit” a small device. It will have to change to fit a smartphone, for example.
I think I can assume that the footer is not a fixed footer but a “sticky footer” instead, one that moves below the bottom of the browser window if the content requies it to do so. Is that assumption correct or not?
Your on-line test page is an active part of this conversation. Our recommendations are based on what we see that you have or have not done. Please keep the communication active.
First question, are you attempting to learn how the HTML and CSS code behaves so you can become a better coder or are you looking for someone else to do the work for you so all you have to do is copy and paste to build your page? If the latter, then hire someone to write it for you.
First assignment, follow Mittineagues recommendations in post #4.
While you are doing that, we will be overhauling your code.
Thanks for that reply,
Yes I already did use his fix code and no it didn’t really help by fixing that dot, I used the { text - decoration: none }
And it seems like its fixed.
And yes, of course I’m attempting to learn how the HTML and CSS code behaves me to become a better coder.
The purpose of my website is to learn and gain experience, I’m experiencing a few issues that I can’t fix that’s why I’m here.
I do not see Mittineague’s repaired HTML on your test page, yet.
Your test page is very short and simple, yet if flags 32 HTML errors. That’s ridiculous. If you do not know what a property does or how to use it, LOOK IT UP.
What browser do you use? If Firefox, it highlights the errors for you when you “View Page Source…”
I notice that the menu is positioned toward the right end of the header bar. Do you plan to put something else in the header bar to the left of the menu?
My mistake. I do not use a full widescreen browser window, so the menu looked like it was sitting toward the right end of the bar. Knowing that it is centered make the design easier to code.
Would you be good enough to post your sample layout again? I was using it to be sure my attempt looked as much like yours as I could.
I trust you will have repaired the bad code. If you cannot be bothered to repair your code, then please let me know because I have many other things I could be doing with my life, too.
Things need to change. I mentioned in another thread about using margins and padding.
These should be used (with set unit values) only for small adjustments, to create gaps between elements or white-space around content.
Don’t use them for page scale layout positioning like this.
padding:0px 0px 15px 622px;
That will only ever work on one size screen.
To centre the menu, create a container with side margins set to auto- margin: 0 auto or if it’s all inline elements use 'text-align: center`.
