Responsive table containing images in HTML and CSS -


Therefore, I am working on a website for a photographer. I'm trying to create a responsive or 'fluid' grid (a table, 2 rows and 4 columns) in the form of a menu to link to the gallery.

There is something like the original idea here (for some reasons it allows me to upload this image but I do not come to post it because I do not have 10 reputation, so here is the link)

Only white squares will obviously be replaced by thumbnails for each gallery page.

There are two things that I want to do with this layout. First and foremost I want this table to be fluid, which I can use this CSS script:

  @charset "utf-8"; / *************** * Fluid grid album menu * / *********************************************************************** @media only screen and (max-width: 1020px {table, thread, tbody, th, td, tr {display: block; font-family: calibri;} thread TR {status: full;} TR {border: 0px;} td {border: none; position: relative;} TD: first {status: relative; padding: 10px;}   

I never really used CSS before I Has not really been much of a developer, isabel If some of this is probably wrong or unnecessary, then apologize to me. Now this works well and is suited for the grid page. The problem is when I try to add the next part

Mouseover I I want to develop the image less, so for this I used this code:

   

Do not redo the wheel You have a plugin here to go:

Comments

Popular posts from this blog

Verilog Error: output or inout port "Q" must be connected to a structural net expression -

jasper reports - How to center align barcode using jasperreports and barcode4j -

c# - ASP.NET MVC - Attaching an entity of type 'MODELNAME' failed because another entity of the same type already has the same primary key value -