Printable View
On this page there is a white section that goes full width.
I'm looking to make it the same width / position etc as the header.
Once done the cloud background will be seen either side of it.
Here is the page but I've made a few changes but this section made no difference.
I've put the changes back as they were know.
Can you advise the correct place to make the change please.
http://www.theremotedoctor.co.uk/acc...llto=selection
Your best bet to troubleshoot would be to use the developer toolbar - F12 in most browsers. Click the inspect/select element arrow and target the problematic area (click on the screen where you suspect the problem lies). You can refine your choice, navigating up and down the DOM in the HTML window at the bottom of the screen, and then you use the style pane on the right to manipulate the CSS on the fly until you find the problem. Learning to use this tool is one of the best weapons in your CSS troubleshooting arsenal.
Do you mean the section below the menu where I see images of audi, numbers and accessories?
Do you want those 3 images to fill out to the width of the above menu and logo image?
Hi,
Ive used F12 like advised and kind of got my own answer of where to make the adjustment.
Im now stuck regarding the size issue,do i use px or %
Ive added this to my css
Looking at the page in question, now you will see with a % used the white banner looks almost correct in respect of it needing it to be the same width as the shadowed box above.Code:max-width:75%;
margin:0 auto;
However on the iphone this white banner falls short of the edges of the shadowed box.
Mlegg,its the white banner those icons live in.
http://www.theremotedoctor.co.uk/acc...llto=selection
I can't check anything from mobile but I would suggest taking your cues from the element you want to mimic - match sizing width and values, padding, margin etc., Basically, check anything that affects the box model of the element you want to modify (Not sure what the box model is? https://www.google.co.uk/search?q=html5+box+model )
Check in the developer toolbar at your critical breakpoints (adjust browser width as necessary) to see if any of the CSS changes, then transfer your on-the-fly style edits to your CSS media queries.
I forgot to say, re: the element-to-mimic: you might need to check the container elements too for compounded styles, e.g) if the outer element has a padding of 20px and the inner element that has a padding of 20px, add them together to copy the combined total padding on your target element.Quote:
Basically, check anything that affects the box model of the element you want to modify
Thanks.
Playing around with Firebug I found the part I needed to alter.
Having said that it didn't look to great so opted for white bar removed and now cloud background is used and looks better anyway.
Have another question so will start a new post.