Urgent layout problems

[broomhandle]

You don’t really want to debug browser-specific quirks on non-semantic markup, like the one you are showing above, do you?

I don’t really have much choice, I’m too far along with what I’ve got. What do you suggest, I don’t really know what you mean by “non-semantic”.

I’ve interpreted what you’ve said as “start the site from scratch and the CSS will be better for it in the end, because it’ll be consistent across everything and won’t have all these quirks”.

[broomhandle]

Clearing history actually worked, thanks. Didn’t think it would because that gallery error went away, then came back, so thought it was a code error.

[broomhandle]

Have got this advice for the 3px Portfolio images gap: “Create a separate class, and only apply it to the items which need a gap if possible.” Ok, how do I do that?

Would it be possible to take your CodePen code and implement that without affecting anything else?

[broomhandle]

Yeah, exactly, that’s the sort of thing I’m looking for, quick fixes. :P As evidenced be. “Would it be possible to CodePen” but perhaps you started typing before I’d written that? :P

I’m going to try putting it in now.

—

I can kind of see how I’d create a new class for the comments text.

Copy the existing one, change the values, and give it a new name?

But how would I apply it to every comments section?

[broomhandle]

Ok, which parts of the CodePen CSS can I get rid of? Obviously I don’t need the font stuff etc?

[Josiahmann]

@Atelierbram I don’t even know what that means, but it I like the way it made me feel. Consider me sold.

[broomhandle]

@Atelierbram err… http://www.peterchamberlaincann.co.uk/portfolio/

[broomhandle]

I had

.entry-content.wide img { margin-bottom: 6px; }

removed already, but

.gallery a img { border: none; height: auto; max-width: 90%; }

is from the parent theme. Do I need to uncomment it then, and how?

[broomhandle]

It’s aligned to the right and something odd going on with the last image still.

[Josiahmann]

[broomhandle]

I did remove align left. The “weird alignment in the image itself” is deliberate.

I think I did remove the gallery class from the ul tag, I can only see <ul class="gallery-portfolio">.

[broomhandle]

Right, so it seems to have fixed itself now, but it’s still all aligned to the right.

[broomhandle]

Ok. The white strip on the left is deliberate yeah, but I’ll probably change it eventually.

This is what I can see: http://s8.postimg.org/87bksqfmd/screenshot.png

[broomhandle]

Brilliant! Final thing for that page… bottom spacing between the gallery and the footer is too big.

[broomhandle]

Excellent!

Ok, now that you made the borders turn blue when you hover over them, I have a desire to remove the borders from all other images. Also so that the single images will match up with the tiled galleries.

How do I do that? :D

[Author]

Posts